Цвет фона background-color: цвет | transparent | inherit цвет можно задавать тремя способами: 1.red, blue, green… 2.#666999, #FF0000, #00FF55… 3.rgb (255,0,0), - презентация

1

2

3 Цвет фона background-color: цвет | transparent | inherit цвет можно задавать тремя способами: 1.red, blue, green… 2.#666999, #FF0000, #00FF55… 3.rgb (255,0,0), rgb(100%,50%,0)… transparent устанавливает прозрачный фон inherit наследует значение родителя

4 file.html style.css

5 Фоновое изображение background-image: url(файл) | none | inherit url используется путь к графическому файлу, который указывается внутри конструкции url(); none отменяет фоновое изображение для элемента; inherit наследует значение родителя

6 Повторение фона background-repeat: no-repeat | repeat | repeat-x | repeat-y | inherit no-repeat устанавливает одно фоновое изображение в элементе без его повторений; repeat изображение повторяется по горизонтали и вертикали; repeat-x изображение повторяется только по горизонтали; repeat-y изображение повторяется только по вертикали; inherit наследует значение родителя.

7 Положение фона background-position: [left | center | right | проценты | значение] || [top | center | bottom | проценты | значение] | inherit background-position: top; background-position: top center; background-position: top; background-position: top center; right top; top right; 100% 0%; right top; top right; 100% 0%; left; left center; 0% 50%; left; left center; 0% 50%; right bottom; 100% 100%; right bottom; 100% 100%; 25% bottom; 25% 100%; 200px bottom; 25% bottom; 25% 100%; 200px bottom; 50% 50%; center center; 50% 50%; center center;

8 Прокручиваемость фона background-attachment: fixed | scroll | inherit fixed - делает фоновое изображение элемента неподвижным при прокручивании; scroll - позволяет перемещаться фону вместе с содержимым при прокручивании; inherit - наследует значение родителя.

9

10

11 Цвет текста color: цвет | inherit Выравнивание текста text-align: center | justify | left | right | inherit Отступ первой строки text-indent: значение | проценты | inherit Вертикальное выравнивание vertical-align: top | middle | bottom | inherit

12 Направление текста direction: ltr | rtl | inherit ltr текст слева направо; rtl текст справа налево; inherit наследует значение родителя. Влияет на :порядок колонок в таблице, позицию полосы прокрутки, положение висячей строки.

13 Интервал между буквами letter-spacing: значение | normal | inherit file.html style.css

14 Оформление текста text-decoration: [ blink | line-through | overline | underline ] | none | inherit blink - мигающий текст; line-through перечеркнутый текст (пример); overline надчеркнутый (пример); underline подчеркнутый текст (пример); none отменяет все эффекты, в том числе и подчеркивания у ссылок; inherit наследуется у родителя.

15 Тень текста text-shadow: none | тень [ ]

16 Преобразование регистра текста text-transform: capitalize | lowercase | uppercase | none | inherit capitalize первый символ каждого слова в предложении будет заглавным; lowercase все символы текста становятся строчными (нижний регистр); uppercase все символы текста становятся прописными (верхний регистр); none не меняет регистр символов.

17 Интервал между словами word-spacing: значение | normal | inherit normal переносы строк автоматические; nowrap весь текст отображается одной строкой; pre текст с учетом всех пробелов и переносов, как они были добавлены разработчиком в коде HTML; Обработка пробелов и энтеров white-space: normal | nowrap | pre | pre-line | pre- wrap | inherit

18

19

20

21

22 Цвет рамки border-color: [цвет | transparent] {1,4} | inherit

23

24 Стиль линии границы (рамки) border-style: [none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset] {1,4} | inherit

25 Ширина линии границы (рамки) border-width: [значение | thin | medium | thick] {1,4} | inherit Более предпочтительный вариант, но в нем важен порядок указания свойств.

26

27 Граница вокруг ячеек таблицы border-collapse: collapse | separate | inherit collapse линия между ячейками отображается только одна; separate вокруг каждой ячейки отображается своя собственная рамка, в местах соприкосновения ячеек показываются сразу две линии.

28 width margin height padding border margin-bottom padding-bottom border-bottom

29

30

31

32