Introduction to CSS
Learn what CSS is and why it matters
CSS
CSS (Cascading Style Sheets) is the language used to style and layout web pages. While HTML provides the structure, CSS controls how that structure looks - colors, fonts, spacing, positioning, and more.
What Can CSS Do?
CSS can transform a plain HTML page into a visually engaging experience:
<p class="plain">Plain HTML</p>
<p class="styled">Styled with CSS</p> .plain {
font-size: 1rem;
color: #64748b;
}
.styled {
font-size: 1.5rem;
color: #6366f1;
font-weight: bold;
padding: 12px 20px;
background: #eef2ff;
border-radius: 8px;
border-left: 4px solid #6366f1;
} CSS is Declarative
You describe what you want, not how to do it. The browser figures out the rendering:
h1 {
color: navy;
font-size: 2rem;
text-align: center;
}
This tells the browser: “Make all <h1> elements navy, 2rem, and centered.”
Separation of Concerns
CSS separates content (HTML) from presentation (styles). This makes code easier to maintain, reuse, and update.
Keep learning
Related tutorials from across the library.
History of CSS
Understand how CSS evolved
Web Development / Frontend / CSS
Adding CSS
Three ways to add CSS to a page
Web Development / Frontend / CSS
CSS Selectors
Target HTML elements with CSS selectors
Web Development / Frontend / CSS