CSS Basics Grammar Tutorial

1. CSS syntax consists of three parts: selectors, attributes, and values
selector {Property:value}
Selectors (selector) are usually HTML elements or tags that you want to define.
property is the property you want to change, and each property has a value, and the attribute and value are separated by colons and surrounded by curly braces, which makes up a complete style declaration.
Example: Body {color:blue}
2. Different ways of writing and units of values (value)
Define colors In addition to red in English words, we can also use hexadecimal color values #ff0000
Example: Body {color: #ff0000}
To save bytes, we can use the abbreviated form of CSS:
Example: Div{color: #f00}
We can also use RGB values in the following two ways:
div {Color:rgb (255,0,0);}
div {Color:rgb (100%,0%,0%);}
But be aware of:
When using the RGB percentage, the percent symbol is written even when the value is 0 o'clock. But in other cases it doesn't have to be. For example, when the size is 0 pixels, the PX unit does not need to be used after 0, because 0 is 0, regardless of the unit.
3. When to use quotation marks
If the value is a number of words, enclose the value in quotes, such as: div {font-family: "sans serif";}
4. Multiple declarations
If you want to define more than one declaration, you need to separate each declaration with a semicolon. The last rule is that you do not need a semicolon, because the semicolon is a separator in English, not a closing symbol. However, most experienced designers will have semicolons at the end of each statement, so the advantage is that when you add or subtract a declaration from an existing rule, you minimize the likelihood of error. For example, the following example:
div {text-align:center; color:red;}