Компании
<<  Comedy Club Piter Style Оформление Торговых Центров  >>
CSS Cascading Style Sheets
CSS Cascading Style Sheets
Структура css селектор { свойство1: значение1; свойство2: значение2; }
Структура css селектор { свойство1: значение1; свойство2: значение2; }
Блочная модель
Блочная модель
Блочная модель
Блочная модель
width — ширина элемента Значения: абсолютные единицы проценты auto
width — ширина элемента Значения: абсолютные единицы проценты auto
height — высота элемента Значения: абсолютные единицы проценты auto
height — высота элемента Значения: абсолютные единицы проценты auto
min-height — минимальная высота max-height — максимальная высота
min-height — минимальная высота max-height — максимальная высота
padding — внутренний отступ Значения: абсолютные единицы проценты
padding — внутренний отступ Значения: абсолютные единицы проценты
padding — внутренний отступ Вариации: padding-top — отступ сверху
padding — внутренний отступ Вариации: padding-top — отступ сверху
padding — внутренний отступ Формат записи: padding: 5px; - все стороны
padding — внутренний отступ Формат записи: padding: 5px; - все стороны
margin — внешний отступ Значения: абсолютные единицы проценты inherit
margin — внешний отступ Значения: абсолютные единицы проценты inherit
margin — внешний отступ Вариации: margin-top — отступ сверху
margin — внешний отступ Вариации: margin-top — отступ сверху
margin — внешний отступ Формат записи: margin: 5px; - все стороны
margin — внешний отступ Формат записи: margin: 5px; - все стороны
border — границы вокруг элемента Формат записи: border: border-width
border — границы вокруг элемента Формат записи: border: border-width
border-width — толщина границ элемента Значения: абсолютные единицы
border-width — толщина границ элемента Значения: абсолютные единицы
border-width — толщина границ элемента Формат записи: border-width:
border-width — толщина границ элемента Формат записи: border-width:
border-style — стиль границ элемента Значения: none hidden dotted
border-style — стиль границ элемента Значения: none hidden dotted
Border-style — стиль границ элемента
Border-style — стиль границ элемента
border-style — стиль границ элемента Формат записи: border-style:
border-style — стиль границ элемента Формат записи: border-style:
border-color — цвет границ элемента Значения: цвет transparent inherit
border-color — цвет границ элемента Значения: цвет transparent inherit
border-color — цвет границ элемента Формат записи: border-color: #000;
border-color — цвет границ элемента Формат записи: border-color: #000;
border — границы вокруг элемента Формат записи: border: border-width
border — границы вокруг элемента Формат записи: border: border-width
border — границы вокруг элемента Формат записи: border: border-width
border — границы вокруг элемента Формат записи: border: border-width
Border-collapse — склеивание границ
Border-collapse — склеивание границ
border-collapse — склеивание границ Значения: collapse — склеиваение
border-collapse — склеивание границ Значения: collapse — склеиваение
border-spacing — расстояние между границами Формат записи:
border-spacing — расстояние между границами Формат записи:
border-radius — радиус скругления Формат записи: border-radius: 3px; —
border-radius — радиус скругления Формат записи: border-radius: 3px; —
Border-radius — радиус скругления
Border-radius — радиус скругления
Overflow — отображение контента, не умещающегося в блок
Overflow — отображение контента, не умещающегося в блок
overflow — отображение контента, не умещающегося в блок Значения:
overflow — отображение контента, не умещающегося в блок Значения:
overflow — отображение контента, не умещающегося в блок Дополнительные
overflow — отображение контента, не умещающегося в блок Дополнительные
background — фон элемента Формат записи: background:
background — фон элемента Формат записи: background:
background-attachment — прокрутка фона Значения: fixed scroll inherit
background-attachment — прокрутка фона Значения: fixed scroll inherit
background-color — цвет фона Значения: цвет transparent inherit
background-color — цвет фона Значения: цвет transparent inherit
background-image — фоновое изображение Значения: url('picture
background-image — фоновое изображение Значения: url('picture
background-position — положение фона Формат записи:
background-position — положение фона Формат записи:
background-position — положение фона Значения: абсолютные значения
background-position — положение фона Значения: абсолютные значения
background-repeat — повторение фона Значения: no-repeat — не повторять
background-repeat — повторение фона Значения: no-repeat — не повторять
Background-repeat — повторение фона
Background-repeat — повторение фона
position — позиционирование Значения: absolute — абсолютное relative —
position — позиционирование Значения: absolute — абсолютное relative —
position — позиционирование Дополнительные свойства: position:
position — позиционирование Дополнительные свойства: position:
z-index — расположение по Z-оси Формат записи: z-index: число;
z-index — расположение по Z-оси Формат записи: z-index: число;
Float — обтекание элемента
Float — обтекание элемента
float — обтекание элемента Значения: left right none inherit
float — обтекание элемента Значения: left right none inherit
Clear — запрет обтекания элемента
Clear — запрет обтекания элемента
clear — запрет обтекания элемента Значения: left right both none
clear — запрет обтекания элемента Значения: left right both none
display — отображение элемента Значения: block inline inline-block
display — отображение элемента Значения: block inline inline-block
visibility — видимость элемента Значения: visible hidden collapse
visibility — видимость элемента Значения: visible hidden collapse

Презентация: «CSS Cascading Style Sheets». Автор: . Файл: «CSS Cascading Style Sheets.ppt». Размер zip-архива: 217 КБ.

CSS Cascading Style Sheets

содержание презентации «CSS Cascading Style Sheets.ppt»
СлайдТекст
1 CSS Cascading Style Sheets

CSS Cascading Style Sheets

2 Структура css селектор { свойство1: значение1; свойство2: значение2; }

Структура css селектор { свойство1: значение1; свойство2: значение2; }

3 Блочная модель

Блочная модель

4 Блочная модель

Блочная модель

5 width — ширина элемента Значения: абсолютные единицы проценты auto

width — ширина элемента Значения: абсолютные единицы проценты auto

inherit

6 height — высота элемента Значения: абсолютные единицы проценты auto

height — высота элемента Значения: абсолютные единицы проценты auto

inherit

7 min-height — минимальная высота max-height — максимальная высота

min-height — минимальная высота max-height — максимальная высота

min-width — минимальная ширина max-width — максимальная ширина Значения: абсолютные единицы проценты auto inherit

8 padding — внутренний отступ Значения: абсолютные единицы проценты

padding — внутренний отступ Значения: абсолютные единицы проценты

inherit

9 padding — внутренний отступ Вариации: padding-top — отступ сверху

padding — внутренний отступ Вариации: padding-top — отступ сверху

padding-right — отступ справа padding-bottom — отступ снизу padding-left — отступ слева

10 padding — внутренний отступ Формат записи: padding: 5px; - все стороны

padding — внутренний отступ Формат записи: padding: 5px; - все стороны

padding: 10px 5px; - сверху/снизу, по бокам padding: 4px 10px 15px; сверху, по бокам, снизу padding: 5px 10px 8px 12px; сверху, справа, снизу, слева

11 margin — внешний отступ Значения: абсолютные единицы проценты inherit

margin — внешний отступ Значения: абсолютные единицы проценты inherit

auto

12 margin — внешний отступ Вариации: margin-top — отступ сверху

margin — внешний отступ Вариации: margin-top — отступ сверху

margin-right — отступ справа margin-bottom — отступ снизу margin-left — отступ слева

13 margin — внешний отступ Формат записи: margin: 5px; - все стороны

margin — внешний отступ Формат записи: margin: 5px; - все стороны

margin: 10px 5px; - сверху/снизу, по бокам margin: 4px 10px 15px; сверху, по бокам, снизу margin: 5px 10px 8px 12px; сверху, справа, снизу, слева

14 border — границы вокруг элемента Формат записи: border: border-width

border — границы вокруг элемента Формат записи: border: border-width

border-style border-color;

15 border-width — толщина границ элемента Значения: абсолютные единицы

border-width — толщина границ элемента Значения: абсолютные единицы

проценты thin (2px) medium (4px) thick (6px) inherit

16 border-width — толщина границ элемента Формат записи: border-width:

border-width — толщина границ элемента Формат записи: border-width:

5px; - все стороны border-width: 10px 5px; - сверху/снизу, по бокам border-width: 4px 10px 15px; сверху, по бокам, снизу border-width: 5px 10px 8px 12px; сверху, справа, снизу, слева

17 border-style — стиль границ элемента Значения: none hidden dotted

border-style — стиль границ элемента Значения: none hidden dotted

dashed solid double

18 Border-style — стиль границ элемента

Border-style — стиль границ элемента

19 border-style — стиль границ элемента Формат записи: border-style:

border-style — стиль границ элемента Формат записи: border-style:

solid; - все стороны border-style: solid none; сверху/снизу, по бокам border-style: solid none dotted; сверху, по бокам, снизу border-style: solid none none dotted; сверху, справа, снизу, слева

20 border-color — цвет границ элемента Значения: цвет transparent inherit

border-color — цвет границ элемента Значения: цвет transparent inherit

21 border-color — цвет границ элемента Формат записи: border-color: #000;

border-color — цвет границ элемента Формат записи: border-color: #000;

- все стороны border-color: #000 red; сверху/снизу, по бокам border-color: #fff #000 #00f; сверху, по бокам, снизу border-color: #fff #0f0 #00f #f00; сверху, справа, снизу, слева

22 border — границы вокруг элемента Формат записи: border: border-width

border — границы вокруг элемента Формат записи: border: border-width

border-style border-color; border: 2px solid #ff0203;

23 border — границы вокруг элемента Формат записи: border: border-width

border — границы вокруг элемента Формат записи: border: border-width

border-style border-color; border-top: 2px solid #ff0203; border-top-width: 2px; border-top-style: solid; border-top-color: #ff0203;

24 Border-collapse — склеивание границ

Border-collapse — склеивание границ

25 border-collapse — склеивание границ Значения: collapse — склеиваение

border-collapse — склеивание границ Значения: collapse — склеиваение

соседних границ separate — разделение соседних границ

26 border-spacing — расстояние между границами Формат записи:

border-spacing — расстояние между границами Формат записи:

border-spacing: 3px; — со всех сторон border-spacing: 3px 5px; — сверху/снизу, слева/справа

27 border-radius — радиус скругления Формат записи: border-radius: 3px; —

border-radius — радиус скругления Формат записи: border-radius: 3px; —

со всех сторон border-radius: 3px 5px; — верхний левый/нижний правый, верхний правый/нижний левый border-radius: 3px 5px 1px; - верхний левый, верхний правый/нижний левый, нижний правый border-radius: 3px 2px 4px 1px; - верхний левый, верхний правый, нижний правый, нижний левый

28 Border-radius — радиус скругления

Border-radius — радиус скругления

29 Overflow — отображение контента, не умещающегося в блок

Overflow — отображение контента, не умещающегося в блок

30 overflow — отображение контента, не умещающегося в блок Значения:

overflow — отображение контента, не умещающегося в блок Значения:

visible — отображается весь контент hidden — контент не отображается scroll — добавляется скролл auto — добавляется скролл при необходимости inherit

31 overflow — отображение контента, не умещающегося в блок Дополнительные

overflow — отображение контента, не умещающегося в блок Дополнительные

свойства: overflow-x — отображение по горизонтали overflow-y — отображение по вертикали

32 background — фон элемента Формат записи: background:

background — фон элемента Формат записи: background:

background-attachment background-color background-image background-position background-repeat; CSS3: background: background1, background2, … ;

33 background-attachment — прокрутка фона Значения: fixed scroll inherit

background-attachment — прокрутка фона Значения: fixed scroll inherit

34 background-color — цвет фона Значения: цвет transparent inherit

background-color — цвет фона Значения: цвет transparent inherit

35 background-image — фоновое изображение Значения: url('picture

background-image — фоновое изображение Значения: url('picture

gif') none inherit

36 background-position — положение фона Формат записи:

background-position — положение фона Формат записи:

background-position: отступ_по_горизонтали отступ_по_вертикали;

37 background-position — положение фона Значения: абсолютные значения

background-position — положение фона Значения: абсолютные значения

проценты left / center / right top / center / bottom inherit

38 background-repeat — повторение фона Значения: no-repeat — не повторять

background-repeat — повторение фона Значения: no-repeat — не повторять

фон repeat — повторять repeat-x — повторять по горизонтали repeat-y — повторять по вертикали inherit

39 Background-repeat — повторение фона

Background-repeat — повторение фона

40 position — позиционирование Значения: absolute — абсолютное relative —

position — позиционирование Значения: absolute — абсолютное relative —

относительное fixed — фиксированное static — стандартное inherit

41 position — позиционирование Дополнительные свойства: position:

position — позиционирование Дополнительные свойства: position:

absolute; /* или relative */ top: 10px; left: 30px; bottom: 5px; right: 10px;

42 z-index — расположение по Z-оси Формат записи: z-index: число;

z-index — расположение по Z-оси Формат записи: z-index: число;

43 Float — обтекание элемента

Float — обтекание элемента

44 float — обтекание элемента Значения: left right none inherit

float — обтекание элемента Значения: left right none inherit

45 Clear — запрет обтекания элемента

Clear — запрет обтекания элемента

46 clear — запрет обтекания элемента Значения: left right both none

clear — запрет обтекания элемента Значения: left right both none

inherit

47 display — отображение элемента Значения: block inline inline-block

display — отображение элемента Значения: block inline inline-block

none list-item

48 visibility — видимость элемента Значения: visible hidden collapse

visibility — видимость элемента Значения: visible hidden collapse

inherit

«CSS Cascading Style Sheets»
http://900igr.net/prezentacija/ekonomika/css-cascading-style-sheets-77268.html
cсылка на страницу
Урок

Экономика

125 тем
Слайды