Кілька властивостей CSS можна записати у вигляді одного рядка значень, яка замінює необхідність вказувати цілий ряд властивостей. Ці властивості описуються значеннями, розділеними пробілами.
Наприклад, ви можете об’єднати margin, padding та border-width і записати margin-top-width, margin-right-width, margin-bottom-width і т.п. у вигляді властивість: top right bottom left;
Отже, замість того, щоб вказувати стиль так:
p {
border-top-width: 1px;
border-right-width: 5px;
border-bottom-width: 10px;
border-left-width: 20px;
}
Ви можете записати їх так:
p {
border-width: 1px 5px 10px 20px;
}
Ви також можете об’єднати border-width, border-color та border-style:
p {
border: 1px red solid;
}
(ви можете використовувати це разом з border-top, border-right та ін)
Якщо ви вказуєте тільки два значення (наприклад, margin: 1em 10em;), то перше значення – це верх і низ, а друге – ліво і право.
Також можна збирати декілька властивостей, які впливають на шрифт, використовуючи властивість font:
p {
font: italic bold 1em/1.5 courier;
}
(де /1.5 – висота рядка)
Підводячи підсумок, розгляньте цей код:
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;
}
Працює відмінно.