CSS code abbreviation, css abbreviation
Simplified Box Model Code
Remember that when talking about the box model, the margin (margin), the padding (padding), and the border (border) are set in the clockwise direction: top, bottom, and left. An example of the specific application in margin and padding is as follows:
Margin: 10px 15px 12px 14px;/* Set 10px to top, 15px to right, 12px to bottom, and 14px to left */
There are usually three Abbreviations:
1. If the top, right, bottom, and left values are the same, see the following code:
margin:10px 10px 10px 10px;
Abbreviations:
margin:10px;
2. If the top and bottom values are the same, left and right values are the same, as shown in the following code:
margin:10px 20px 10px 20px;
Abbreviations:
margin:10px 20px;
3. If the left and right values are the same, see the following code:
margin:10px 20px 30px 20px;
Abbreviations:
margin:10px 20px 30px;
Note: The abbreviation of padding and border is the same as that of margin.
Abbreviation of color value
Css styles of colors can also be abbreviated. When the color you set is a hexadecimal color value, if the two values are the same, they can be abbreviated to half.
Example 1:
p { color:#000000; }
Can be abbreviated:
p { color: #000; }
Example 2:
p { color: #336699; }
Can be abbreviated:
p { color: #369; }
Abbreviation
The font css style code in a webpage can also be abbreviated. The following Code sets the font for the webpage:
Body {font-style: italic; font-variant: small-caps; font-weight: bold; font-size: 12px; line-height: 1.5em; font-family: "", sans-serif ;}
So many lines of code can be abbreviated as one sentence:
Body {font: italic small-caps bold 12px/1.5em "", sans-serif ;}
Font-family: "", sans-serif; // set the Chinese font to and the English font to the first three orders of sans-serif, the last two orders are fixed and must have
Note:
1. You must specify at least the font-size and font-family attributes in this shorthand method, if other attributes (such as font-weight, font-style, font-varient, and line-height) are not specified, the default value is automatically used.
2. Add "/" to the center of font-size and line-height.
Generally, the abbreviated code below is commonly used because there are few Chinese websites in English:
Body {font: 12px/1.5em "", sans-serif ;}
Only font size, line spacing, Chinese font, and English font settings are available.