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 code:
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同样可以合并到一起,例如:
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", times, serif;
padding: 3em 1em;
border: 1px black solid;
border-width: 1px 5px 5px 1px;
border-color: red green blue yellow;
margin: 1em 5em;
}
Recommended that you use abbreviations, to promote the simplification of CSS code, optimization!