
- •5. Каскадные таблицы стилей
- •1.Понятие таблицы стилей. Помещение таблицы стилей на страницу. Внутренние и внешние таблицы стилей.
- •2.Приоритет стилей. Атрибут style. Директивы @import и!important.
- •3.Единицы измерения в css.
- •4 Управление размером элементов с помощью css. Использование процентного размера.
- •5.Правила записи стилевых правил.
- •7. Форматирование шрифта с помощью css.
- •1.Форматирование абзацев с помощью css.
- •2.Управление цветом с помощью css.
- •3.Форматирование объектов с помощью css: отступы и границы.
- •4.Внешние и внутренние отступы в css.
- •5.Позиционирование с помощью css.
- •6.Управление видимостью объекта в css.
- •7.Графика с помощью css.
- •8.Оформление таблиц с помощью css.
- •9.Оформление списков с помощью css.
- •10.Плавающие элементы в css.
- •11.Построение навигационных меню с помощью css. Вертикальное меню.
- •12.Создание горизонтального навигационного меню с помощью css.
- •13.Разметка страницы с помощью css.
- •14.Сравнение табличной и блочной верстки.
- •15.Блочная фиксированная разметка с помощью css.
- •16.Блочная гибкая разметка с помощью css.
- •17.Применение абсолютного позиционирования на странице. Правило z-index.
- •18.Применение относительного позиционирования. Создание эффектов объема и тени.
- •19.Правило display. Его назначение и применение.
- •20.Управление стилями элементов htmLпо их атрибутам.
3.Единицы измерения в css.
В CSS-свойстве font-size используются различные единицы измерения размера шрифта (em, ex, px, in, cm, mm, pt, pc, %), которые могут быть разделены на две группы.
Относительные длины
em: ширина одного символа «главного» шрифта. (один em равен размеру текущего шрифта текущего элемента)
ex: высота одного символа «главного» шрифта. (один ex равен x-height шрифта (x-height составляет обычно около половины font-size))
px: пиксел, зависит от дисплея (разрешение и плотности пикселей)
Абсолютные длины
in: дюймы. Один дюйм равен 2.54 сантиметра
cm: сантиметры
mm: миллиметры
pt: «пункты» — 1 пункт в CSS равен 1/72 дюйма.
pc: пика — 1 пика равна 12 пунктам.
Величина «проценты» определена относительно длины или другой величины.
Цвета
Единица Описание
color_name Название цвета (например, red)
rgb(x,x,x) Значение RGB (например, rgb(255,0,0))
rgb(x%, x%, x%) Значение RGB в процентах (например, rgb(100%,0%,0%))
#rrggbb шестнадцатеричное число (например, #ff0000)
--
Перечислим множество наиболее распространенных/важных терминов, связанных с Web-дизайном и разработкой, и их определения.
абсолютная единица измерения - в CSS используются in, cm, mm, pt, pc
выравнивание - основные значения: left, right, centred, justified
em - базовая концепция: типографская единица измерения, определяется как размер шрифта в пунктах, традиционно ширина символа M равнялась одному em, но это часто не соответствует действительности в современных гарнитурах шрифтов.
en - базовая концепция: типографская единица измерения, определяемая как половина высоты шрифта, обычно ширина буквы n.
пика - базовая концепция: используемая компьютерами современная пика равна 4.233mm или 0.166",
пункт - базовая концепция: в каждом дюйме имеется 72 пункта, и 12 пунктов в пика.
относительные единицы измерения - в CSS используются em, ex, px
засечки - расширяющееся основание, нарисованной на одной или обоих сторонах окончания штриха, чаще всего находящиеся вблизи базовой линии и верхней линии прописных букв строки текста; также классификация любой гарнитуры, которая реализует это свойство в своем дизайне (иначе без засечек)
x-высота высота строчной буквы "x", которая обычно бывает одинаковой у большинства строчных букв шрифта. Указывается в CSS единицей измерения ex. Необходимо переписать, так как не совсем правильно. Реальное определение является расстоянием между средней линией и базовой линией. Это высота букв x, u, v, w и z во многих, но не всех шрифтах. Другие буквы возвышаются, спускаются ниже, или прeвосходят x-высоту, чтобы выглядеть лучше (буквы с криволинейным верхом, такие как c, o и т.д.).
Em, проценты, и пункты, согласно CSS
Традиционно, единица измерения em эквивалентна высоте прописной буквы "M" в шрифте, к которому она применяется. Однако в CSS единица измерения em в действительности эквивалентна общей высоте одной строки; другими словами высоте элемента, font-size которого задан как 14 пикселей:
1em = 100% = 14px
В типичных рабочих средах это утверждение выше можно расширить до следующего:
1em = 100% = 14px = 10.5pt