Hello everyone, and welcome to this course! I'm Lao Zhao at the front end! Today we will explore the basic syntax and selectors of CSS, which is an important step in our deep understanding of CSS. CSS syntax is the foundation of CSS and a necessary prerequisite for mastering CSS. The selector is the core of CSS. Through the selector, we can set the style and appearance for different HTML elements. In this section, we will explain in detail the basic syntax of CSS and the use of selectors.
First, let's take a look at the basic syntax of CSS. The syntax of CSS consists of selectors and declaration blocks, where selectors are used to select HTML elements, and declaration blocks contain one or more declarations, each of which is used to set the value of a property. Here is a simple CSS code example:
CSS
p{ color: red; font-size: 16px; }In this example, p is a selector, which selects all <p> tags, indicating that the attributes in this declaration block will be applied to all paragraph elements. color and font-size are two attributes used to set the text color and font size respectively. In a declaration block, colons are used to separate properties and values, and semicolons are used to separate different declarations.
Next, let's take a look at selectors. A selector is a mode used to select HTML elements, which can be selected according to the element's tag name, class name, ID, attribute and other characteristics. Here are a few common selectors:
1. Tab selector
The tag selector is the most common type of selector, which selects elements by their tag names. For example, the CSS code below will set all