This article is for learning notes, part of which is excerpted from Mr. Xiaofeng's "CSS Design Guide" book
CSS Rules
A CSS rule is actually a CSS instruction that first selects the HTML element and then sets the style of the selected element.
Here is a simple CSS rule that sets the paragraph background color to green
Example_1
P{background-color:green}
CSS rule naming
A CSS rule consists of a selector + declaration of two parts
Selector: Indicates the element to select
Declaration: consists of attributes and values, attributes indicate which aspect of the element is affected, and the value is actually a state of the attribute
In the example above, you can see that a rule is left to right: selector, Zohua bracket, attribute, colon, value, right curly brace
Extensions to the Example_1
①: Multiple declarations are written in a rule
P{color:green;font-size:45px;font-weight:bold}
The HTML code is as follows:
Operation Effect:
PS: Between each declaration, separated by semicolons
②: Combine multiple selectors with commas
H1,h3,p{color:green;font-size:45px;font-weight:bold}
HTML code:
Run effect
③: Multiple rules apply to the same selector
H1,h3,p{color:green;font-size:45px;font-weight:bold}
Now we want the background color of the p paragraph to be blue, so you can continue to add a rule
P{background-color:blue}
Run effect
What kinds of selectors are there?
One: Contextual selectors select an element based on ancestor or sibling elements
Two: ID and class selectors select elements based on the values of the ID and class attributes
Three: Attribute selectors are based on attributes with or without feature selection elements
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
