What is CSS?

Learn the fundamentals of Cascading Style Sheets

Introduction to CSS

CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of a document written in HTML or XML. CSS describes how elements should be rendered on screen, on paper, in speech, or on other media.

What CSS Does:

  • Styling: Controls colors, fonts, spacing, and layout
  • Layout: Positions elements on the page
  • Responsive Design: Makes websites work on all devices
  • Animations: Adds movement and interactivity
  • Maintainability: Easy updates—change style in one place.

CSS Syntax

CSS is written using selectors and declarations. The basic syntax looks like this:

                        
 selector {
          property: value;
         }             
                        
                    

Basic CSS Example:

                            

/* CSS Rule */
h1 {
    color: blue;
    font-size: 24px;
    text-align: center;
}

/* This styles all h1 elements */
/* - Makes text blue */
/* - Sets font size to 24 pixels */
/* - Centers the text */

How CSS Works

CSS works by selecting HTML elements and applying styles to them. The browser reads both the HTML and CSS, then combines them to display the styled webpage.

HTML + CSS Example:

                            
/* CSS */

<h1 class="main-title">Welcome to CodingRider</h1>
<p class="intro">Learn web development with us!</p>

/* CSS */
.main-title {
    color: #2563eb;
    font-size: 2.5rem;
    margin-bottom: 1rem;
}

.intro {
    color: #6b7280;
    font-size: 1.2rem;
    line-height: 1.6;
}

Why Learn CSS?

  • Essential Skill: Required for all web development
  • Creative Control: Design beautiful, unique websites
  • Career Opportunities: High demand for CSS skills
  • User Experience: Create engaging, accessible interfaces