Сокращение свойств

Несколько свойств CSS можно записать в виде одной строки значений, которая заменяет необходимость указывать целый ряд свойств. Эти свойства описываются значениями, разделенными пробелами.

Например, вы можете объединить margin, padding и border-width и записать margin-top-width, margin-right-width, margin-bottom-width и т.п. в виде свойство: top right bottom left;

Следовательно, вместо того, чтобы указывать стиль так:

1

p

 

2

    border-top-width: 1px;

 

3

    border-right-width: 5px;

 

4

    border-bottom-width: 10px;

 

5

    border-left-width: 20px;

 

6

Вы можете записать их так:

1

p

 

2

    border-width: 1px 5px 10px 20px;

 

3

Вы также можете объединить border-width, border-color и border-style:

1

p

 

2

    border: 1px red solid;

 

3

(вы можете использовать это вместе с border-top, border-right и др.)

Если вы указываете только два значения (например, margin: 1em 10em;), то первое значение — это верх и низ, а второе — лево и право.

Также можно собирать несколько свойств, которые влияют на шрифт, используя свойство font:

1

p

 

2

    font: italic bold 1em/1.5 courier;

 

3

(где /1.5 – высота строки)

Подводя итог, рассмотрите этот код:

view sour

print

?

1

p

 

2

    font: 1em/1.5 "Times New Roman", times, serif;

 

3

    padding: 3em 1em;

 

4

    border: 1px black solid;

 

5

    border-width: 1px 5px 5px 1px;

 

6

    border-color: red green blue yellow;

 

7

    margin: 1em 5em;

 

8

Работает отлично.