Common CSS Abbreviations

Css

Using abbreviations can help reduce the size of your CSS files and make it easier to read. The main rules for CSS abbreviations are as follows:

Color

16 The color value of the binary, if the value of each two digits is the same, you can abbreviate half, for example:
#000000可以缩写为 #000; #336699可以缩写为 #369;

Box size

There are usually four ways to write:

• property:value1; Indicates that all edges are a value value1;
• Property:value1 value2; The values that represent top and bottom are value1,right and left values that are value2
• Property:value1 value2 Value3; The value that represents top is value1,right and left is the value of Value2,bottom is Value3
• Property:value1 value2 value3 value4; The four values, in turn, represent Top,right,bottom,left

Convenient memory method is clockwise, upper right and lower left. Examples of specific applications in margin and padding are as follows:
Margin:1em 0 2em 0.5em;

Border (border)

The properties of the border are as follows:

• border-width:1px;
• Border-style:solid;
• Border-color: #000;

can be abbreviated as one sentence: border:1px solid #000;

Grammar is border:width style color;

Background (backgrounds)

The properties of the background are as follows:

• Background-color: #f00;
• Background-image:url (background.gif);
• Background-repeat:no-repeat;
• background-attachment:fixed;
• background-position:0 0;

can be abbreviated to one sentence: background: #f00 URL (background.gif) no-repeat fixed 0 0;

The grammar is Background:color image repeat attachment position;

You can omit one or more of the property values, and if omitted, the property value will be in the browser default value, the default value is:

• Color:transparent
• Image:none
• Repeat:repeat
• Attachment:scroll
• position:0% 0%

Font (Fonts)

The properties of the font are as follows:

• Font-style:italic;
• Font-variant:small-caps;
• Font-weight:bold;
• Font-size:1em;
• line-height:140%;
• font-family: "Lucida Grande", Sans-serif;

can be abbreviated as one sentence: Font:italic small-caps bold 1em/140% "Lucida Grande", Sans-serif;

Note that if you abbreviate a font definition, you must define at least two values for font-size and font-family.

List (lists)

Cancellation of the default dot and ordinal can be written like this list-style:none;

The properties of the list are as follows:

• List-style-type:square;
• List-style-position:inside;
• List-style-image:url (Image.gif);

can be abbreviated to one sentence: List-style:square inside URL (image.gif);