Learn CSS – Part 1 – Introduction to CSS – Styling the Web
CSS (Cascading Style Sheets) is used to style and design web pages. It controls how HTML elements look on the screen.
Without CSS, websites would appear plain and unstructured with only basic content.
What is CSS?
CSS is a stylesheet language used to apply styles such as colors, layouts, fonts, and spacing to HTML elements.
It works together with HTML to create visually appealing and user-friendly websites.
Basic Example of CSS
<!DOCTYPE html>
<html>
<head>
<style>
h1 {
color: blue;
}
</style>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
In this example:
h1is the selectorcoloris the propertyblueis the value
How CSS Works
CSS applies styles by selecting HTML elements and defining how they should appear.
It follows a simple rule structure:
selector {
property: value;
}
Ways to Add CSS
There are three main ways to use CSS in a webpage:
- Inline CSS – Applied directly inside HTML elements
- Internal CSS – Defined inside the <style> tag
- External CSS – Written in a separate .css file
Why is CSS Important?
- Improves the design and appearance of websites
- Separates content (HTML) from design (CSS)
- Makes websites responsive and user-friendly
- Saves time by reusing styles across pages
CSS transforms simple HTML pages into beautiful and modern websites.
Quick Summary
| Feature | CSS |
|---|---|
| Full Form | Cascading Style Sheets |
| Purpose | Styling web pages |
| Works With | HTML |
| Types | Inline, Internal, External |
Conclusion
CSS is an essential part of web development that brings design and layout to web pages. It allows you to control how your website looks and feels.
What’s Next?
Now that you understand what CSS is, the next step is learning about CSS syntax and how to write CSS rules correctly.
Next: Learn CSS – Part 2 – CSS Syntax Explained →
Series: Learn CSS Series
