Summary of common CSS abbreviation syntax

Original address: http://www.w3cn.org/article/tips/2005/103.html

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

Color

16 binary color values, if each two bits of the same value, can be shortened by 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 value representing top and bottom is the value of Value1,right and left is value2
• Property:value1 value2 Value3; The value that represents top is the value of Value1,right and left is the value of Value2,bottom is Value3
• Property:value1 value2 value3 value4; Four values in turn represent Top,right,bottom,left

Convenient memory method is clockwise, upper right down 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 a sentence: border:1px solid #000;

The grammar is border:width style color;

background (backgrounds)

The properties of the background are as follows:

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

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

The syntax is background:color image repeat attachment position;

You can omit one or more of the property values, and if omitted, the value of the property will be the default value of the browser, which 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 a 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)

Cancel 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 as a sentence: List-style:square inside URL (image.gif);

Original address: http://www.w3cn.org/article/tips/2005/103.html

Common CSS abbreviation syntax summary