Simple understanding of css, simple css
Today, we mainly talk about css style sheets! HTML can be used in combination with other HTML pages! First, I will briefly introduce why CSS (CAscadingSTyleSHeets) stacked style sheet!
1. Because CSS style sheets can define how HTML elements are displayed
2. All mainstream browsers support CSS style sheets
3. Style Sheets greatly improve work efficiency
4. In addition, multiple style sheets can be stacked into one
Which style will be used if the same HTML element is defined by more than one style?
Generally, all styles are stacked in a new virtual style table according to the following rules, of which 4th have the highest priority.
1. default browser settings
2. External Style Sheets
3. Internal style sheet (inside the
4. inline style (inside the HTML element)
Therefore, inline styles haveHighestPriority, which means it will take precedence over the following style Declaration:
The following describes his syntax:
Css rules mainly consist of two parts: Selector and one or more declarations.
1 div{2 width:100px;3 height:100px;4 }
The selector is usually an HTML element that you need to change the style.
Each declaration consists of an attribute and a value!
Property is the style attribute you want to set. Each property has a value. The property and value are separated by colons.
The following code defines the text color in the H1 element as red, and sets the font size to 14 pixels.
In this example,. h1 is the selector, and color and font-size are attributes. red and 14px are values.
h1{ color:red; font-size:14px;}
The following figure shows the structure of the above Code:
Different write methods and units of values:
In addition to the English word red, we can also use the hexadecimal color value # ff0000;
p{ color:#ff0000;}
We can also use RGB values in two ways:
p{ color:rgb(255,0,0);}p{ color:rgb(100%,0%,0%);}
Remember to write quotation marks:
Tip: If the value is a number of words, you must quote the value;
P {
Font-family: "sans serif ";
}
Today is the first day! Goodbye tomorrow !!!