Use abbreviations to facilitate the streamlining of CSS code

Css

Some CSS properties allow a string of values to be substituted for many properties, with the value separated by a space.

Margin,pdding and Border-width allow merging of Margin-top-width, Margin-right-width, Margin-bottom-width, and so on, in the form of: Property:top Right bottom, counterclockwise order.

So the following:

p {
border-top-width:1px;
border-right-width:5px;
border-bottom-width:10px;
border-left-width:20px;
}

Can be written as:

p {
border-width:1px 5px 10px 20px;
}

Border-width,border-color,border-style can also be merged together, for example:

p {
BORDER:1PX Red Solid;
}

(The same can be applied to border-top,border-right, etc.)

If you use only two values (such as margin:1em 10em;), the first value includes the top and bottom, and the second value is left or right.

Font properties can also be merged using the Font property.

p {
Font:italic Bold 1em/1.5 Courier;
}

(Above "/1.5" is the value of Line-height)

To sum them up, try the following code:

p {
font:1em/1.5 "Times New Roman", the Times, serif;
Padding:3em 1em;
BORDER:1PX Black Solid;
border-width:1px 5px 5px 1px;
Border-color:red Green blue yellow;
Margin:1em 5em;
}