Introducing CSS
Learn the basics of CSS syntax, selectors, and properties, along with the methods for linking stylesheets and their precedence.
We'll cover the following...
Cascading Style Sheets (CSS) is a stylesheet language used to describe the presentation of HTML documents. While HTML structures the content, CSS handles the visual layout, allowing us to control the appearance of web pages with precision.
Below is an illustration showing the same web page before and after applying CSS, highlighting the dramatic difference in design and layout.
Understanding CSS syntax
CSS comprises rules that tell the browser how to display elements on the page. Each rule consists of a selector and a declaration block ({}).
selector{property: value;}
Selectors
Selectors specify which HTML elements the styles should be applied to. Common selectors include element selectors (e.g., p, h1), class selectors (e.g., .classname), and ID selectors (e.g., #idname).
h1 {color: navy;}
This rule applies to all <h1> elements.
Properties and values
Within the declaration block {}, we can define properties and their corresponding values.
h1 {color: navy;font-size: 16px;}
In the above code, color and font-size are properties while navy and 16px are values.
Understanding CSS comments
Comments in CSS are non-executing lines of code that the browser ignores when rendering the web page. They serve as notes or explanations within the stylesheet, ...
Create a free account to view this lesson.
By signing up, you agree to Educative's Terms of Service and Privacy Policy