CSS Syntax

CSS Syntax: A CSS rule comprises of a selector and a declaration block.

What is CSS?

• CSS stands for Cascading Style Sheets

• CSS describes how HTML elements are to be shown on screen, paper, or in different media

• CSS saves a lot of work. It can handle the layout of various website pages at the same time

• External stylesheets are stored in CSS files

The selector points to the HTML element you need to style.
The declaration block contains one or more declarations separated by semicolons.
Each declaration incorporates a CSS property name and a value, separated by a colon.
Various CSS declaration are separated with semicolons, and declaration blocks are encircled by curly braces.

Example

In this example all <p> elements will be center-aligned, with a red text color:

<!DOCTYPE html>
<html>
<head>
<style>
p {
  color: red;
  text-align: center;
} 
</style>
</head>
<body>

<p>Hello World!</p>
<p>These paragraphs are styled with CSS.</p>

</body>
</html>

Example Explained

p is a selector in CSS (it points to the HTML element you want to style: <p>).
color is a property, and red is the property value
text-align is a property, and center is the property value

You will learn much more about CSS selectors and CSS properties in the next chapters!

Thanks for reading! We hope you found this tutorial helpful and we would love to hear your feedback in the Comments section below. And show us what you’ve learned by sharing your projects with us.