Текст text-decoration

Сентябрь 3, 2022

Главная
Алгебра
Текст text-decoration

Содержание

2. Текст text-indent – отступ первой строки (только для блочных элементов) Пример text-indent: 15px; text-indent: 30%;
3. Текст text-transform – преобразование текста Значения capitalize - первый символ каждого слова в предложении будет заглавным.
4. Текст letter-spacing – расстояние между символами Пример letter-spacing: 4px; letter-spacing: normal;
5. Текст line-height – межстрочный интервал Примеры line-height: 1.5; line-height: 12px; line-height: 80%; line-height: normal;
6. Фон background-color – цвет фона Пример background-color: #ff0000; background-color: red;
7. Фон background-image – фоновое изображение Пример background-image: url("1.PNG"); background-image: none; background-image: inherit;
8. Фон background-position – положение фонового изображения Пример background-position: 20px 30px; background-position: 50% 100%; background-position: bottom right;
9. background-position top left = left top = 0% 0% (в левом верхнем углу) top = top
10. Фон background-repeat – повторение фонового изображения Пример background-repeat: repeat; background-repeat: no-repeat; background-repeat: repeat-x; background-repeat: repeat-y;
11. background-repeat background-repeat: Г В; Г – по горизонтали В – по вертикали no-repeat – без повторений
12. Фон background-attachment – поведение фонового изображения при прокрутке Пример background-attachment: scroll; background-attachment: fixed;
13. Списки list-style-type – вид нумерации или маркировки списка Маркированный список circle - маркер в виде кружка.
14. Списки Нумерованный список armenian - традиционная армянская нумерация. decimal - арабские числа (1, 2, 3, 4,...).
15. Списки list-style-position – расположение маркера относительно текста Пример list-style-position: outside; list-style-position: inside;
16. Списки list-style-image – изображение маркера Пример list-style-image: url(1.png); list-style-image: none;
18. Скачать презентацию

Слайд 2

Текст
text-indent – отступ первой строки (только для блочных элементов)
Пример
text-indent: 15px;
text-indent: 30%;

Слайд 3

Текст
text-transform – преобразование текста
Значения
capitalize - первый символ каждого слова в предложении

будет заглавным. Остальные символы свой вид не меняют.
lowercase - все символы текста становятся строчными (нижний регистр).
uppercase - все символы текста становятся прописными (верхний регистр).
none - не меняет регистр символов.

Слайд 4

Текст
letter-spacing – расстояние между символами
Пример
letter-spacing: 4px;
letter-spacing: normal;

Слайд 5

Текст
line-height – межстрочный интервал
Примеры
line-height: 1.5;
line-height: 12px;
line-height: 80%;
line-height: normal;

Слайд 6

Фон
background-color – цвет фона
Пример
background-color: #ff0000;
background-color: red;

Слайд 7

Фон
background-image – фоновое изображение
Пример
background-image: url("1.PNG");
background-image: none;
background-image: inherit;

Слайд 8

Фон
background-position – положение фонового изображения
Пример
background-position: 20px 30px;
background-position: 50% 100%;
background-position: bottom right;

Слайд 9

background-position
top left = left top = 0% 0% (в левом верхнем

углу)
top = top center = center top = 50% 0% (по центру вверху)
right top = top right = 100% 0% (в правом верхнем углу)
left = left center = center left = 0% 50% (по левому краю и по центру)
center = center center = 50% 50% (по центру)
right = right center = center right = 100% 50% (по правому краю и по центру)
bottom left = left bottom = 0% 100% (в левом нижнем углу)
bottom = bottom center = center bottom = 50% 100% (по центру внизу)
bottom right = right bottom = 100% 100% (в правом нижнем углу)

Слайд 10

Фон
background-repeat – повторение фонового изображения
Пример
background-repeat: repeat;
background-repeat: no-repeat;
background-repeat: repeat-x;
background-repeat: repeat-y;

Слайд 11

background-repeat
background-repeat: Г В;
Г – по горизонтали
В – по вертикали
no-repeat – без

повторений
repeat – с повторениями
space - изображение повторяется столько раз, чтобы полностью заполнить область; если это не удаётся, между картинками добавляется пустое пространство.
round - изображение повторяется так, чтобы в области поместилось целое число рисунков; если это не удаётся сделать, то фоновые рисунки масштабируются.

Слайд 12

Фон
background-attachment – поведение фонового изображения при прокрутке
Пример
background-attachment: scroll;
background-attachment: fixed;

Слайд 13

Списки
list-style-type – вид нумерации или маркировки списка
Маркированный список
circle - маркер в

виде кружка.
disc - маркер в виде точки.
square - маркер в виде квадрата.

Слайд 14

Списки
Нумерованный список
armenian - традиционная армянская нумерация.
decimal - арабские числа (1, 2,

3, 4,...).
decimal-leading-zero - арабские числа с нулем впереди для цифр меньше десяти (01, 02, 03,...).
georgian - традиционная грузинская нумерация.
lower-alpha - строчные латинские буквы (a, b, c, d,...).
lower-greek - строчные греческие буквы (α, β, γ, δ,...).
lower-latin - это значение аналогично lower-alpha.
lower-roman - римские числа в нижнем регистре (i, ii, iii, iv, v,...).
upper-alpha - заглавные латинские буквы (A, B, C, D,...).
upper-latin - это значение аналогично upper-alpha.
upper-roman - римские числа в верхнем регистре (I, II, III, IV, V,...).
none - отменяет маркеры для списка.

Слайд 15

Списки
list-style-position – расположение маркера относительно текста
Пример
list-style-position: outside;
list-style-position: inside;

Слайд 16

Текст text-decoration

Содержание

Текстtext-indent – отступ первой строки (только для блочных элементов)Примерtext-indent: 15px;text-indent: 30%;

Текстtext-transform – преобразование текстаЗначенияcapitalize - первый символ каждого слова в предложении

Текстletter-spacing – расстояние между символамиПримерletter-spacing: 4px;letter-spacing: normal;

Текстline-height – межстрочный интервалПримерыline-height: 1.5;line-height: 12px;line-height: 80%;line-height: normal;

Фонbackground-color – цвет фонаПримерbackground-color: #ff0000;background-color: red;

Фонbackground-image – фоновое изображениеПримерbackground-image: url("1.PNG");background-image: none;background-image: inherit;

Фонbackground-position – положение фонового изображенияПримерbackground-position: 20px 30px;background-position: 50% 100%;background-position: bottom right;

background-positiontop left = left top = 0% 0% (в левом верхнем

Фонbackground-repeat – повторение фонового изображенияПримерbackground-repeat: repeat;background-repeat: no-repeat;background-repeat: repeat-x;background-repeat: repeat-y;

background-repeatbackground-repeat: Г В;Г – по горизонталиВ – по вертикалиno-repeat – без

Фонbackground-attachment – поведение фонового изображения при прокруткеПримерbackground-attachment: scroll;background-attachment: fixed;

Спискиlist-style-type – вид нумерации или маркировки спискаМаркированный списокcircle - маркер в

СпискиНумерованный списокarmenian - традиционная армянская нумерация.decimal - арабские числа (1, 2,

Спискиlist-style-position – расположение маркера относительно текстаПримерlist-style-position: outside;list-style-position: inside;

Спискиlist-style-image – изображение маркераПримерlist-style-image: url(1.png);list-style-image: none;

Похожие презентации