Syntax summary of commonly used CSS abbreviations_CSS/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

Hexadecimal color value, if the values ​​of each two digits are the same, can be abbreviated by half, for example:
#000000 can be abbreviated to #000; #336699 can be abbreviated to #369;

Box size

There are usually four writing methods:

• property:value1; means that all edges have a value value1;
• property:value1 value2; means the value of top and bottom is value1, and the value of right and left is value2
• property:value1 value2 value3; means the value of top is value1, the value of right and left is value2, and the value of bottom is value3
• property:value1 value2 value3 value4; The four values ​​represent top, right, bottom, left in turn

The convenient way to remember is clockwise, top right, bottom 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 to one sentence: border:1px solid #000;

The syntax isborder:width style color;

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 syntax isbackground:color image repeat attachment position;

You can omit one or more of the attribute values. If omitted, the attribute value will use the browser default value. The default value is:

• color: transparent
• image: none
• repeat: repeat
• attachment: scroll
• position: 0% 0%

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 to one sentence: font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;

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

Lists

To cancel the default dots and serial numbers, you can write list-style:none;,

The attributes of

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);