Выбор занятия

Выберите текущее занятие

• Занятие 1
• Занятие 2
• Занятие 3
• Занятие 4
• Занятие 5
• Занятие 6
• Занятие 7
• Занятие 8
• Занятие 9
• Занятие 10
• Занятие 11
• Занятие 12
• Занятие 13
• Занятие 14
• Занятие 15
• Занятие 16

Все материалы предоставлены в образовательных целях. Для пополнения базы материалов или цитат присылайте свои тексты на эл. почту (внизу страницы).

CSS

Свойства шрифтов

Возможность управлять шрифтом - меняете ли вы его семейство, кегель или толщину - позволяет увеличить блеск и неповторимость WEB-страниц.
Для начала немного информации о понятиях шрифтов:

Свойство font-family указывает приоритетный список шрифтов, используемых для отображения данного элемента или web-страницы. Если первый шрифт списка не установлен на компьютере, с которого выполняется доступ к сайту, ищется следующий шрифт списка, пока не будет найден подходящий.
Family-name - Пример family-name (часто называемое просто "шрифт") это, например, "Arial", "Times New Roman" или "Tahoma". Generic family - Его можно проще описать как группу family-names, имеющих характерные общие черты. Пример - sans-serif, набор шрифтов без "засечек/feet".
Разницу можно также проиллюстрировать так:
При указании шрифтов для вашего web-сайта вы, естественно, начинаете с предпочтительного шрифта, а затем перечисляете альтернативные. Рекомендуем в конце списка указывать родовое имя. Тогда страница, как минимум, будет отображена шрифтом того же семейства, если отсутствуют все специфицированные конкретные шрифты.

Свойство стиля	Описание свойства	Значения	Значение по умолчанию
font-family	Гарнитура шрифта	список имен шрифтов, перечисленных через запятую в порядке убывания предпочтения; список может заканчиваться одним из родовых имен: serif (с засечками, "антиква"), sans-serif (без засечек, "рубленый"), cursive (курсив), fantasy (аллегорический), monospace (моноширинный)
font-size	Размер шрифта	размер, процент, xx-small,x-small, small, medium, large, x-large, xx-large, larger, smaller	medium
font-style	Начертание шрифта	normal, italic (курсив), oblique (наклонный)	normal
font-weight	Насыщенность шрифта	число от 100 до 900 (кратное 100), normal, bold, bolder, lighter	normal
font-variant	Может задать вывод капителью (символами, похожими на прописные, но малого размера); капитель есть не во всяком шрифте	normal, small-caps (капитель)	normal
font-stretch	Задание нормального, разреженных (expanded) или сжатых (condensed) начертаний из текущей гарнитуры шрифта	normal, wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded	normal
font	Стенографическое свойство для одновременного задания нескольких свойств шрифта	список свойств шрифта, разделенных пробелами, в следующем порядке: font-style, font-variant, font-weight, font-size, line-height, font-family

Стенографические свойства (shorthand properties ) позволяют одновременно задать несколько свойств; значения свойств в списке разделяются пробелами. Например:

font: [font-style||font-variant||font-weight] font-size [/line-height] font-family | inherit
p { font: 12pt/10pt sans-serif; }
	

В качестве обязательных значений свойства font указывается размер шрифта и его семейство. Остальные значения являются опциональными и задаются при желании.

Допускается в качестве значения использовать ключевые слова, определяющие шрифт различных элементов операционной системы пользователя.

• caption - Шрифт для текста элементов форм вроде кнопок.
• icon - Шрифт для текста под иконками.
• menu - Шрифт применяемый в меню.
• message-box - Шрифт для диалоговых окон.
• small-caption - Шрифт для подписей к небольшим элементам управления.
• status-bar - Шрифт для строки состояния окон.

Свойства текста

Свойство стиля	Описание свойства	Значения	Значение по умолчанию
text-indent	Отступ первой строки текста в блоке	размер, процент (относительно ширины блока)	0
text-align	Выравнивание текста	left, right, center, justify
text-decoration	Декорирование текста	none (нет), underline (подчеркнутый), overline (надчеркнутый), line-through (перечеркнутый), blink (мерцающий)	none
text-shadow	Эффекты затенения текста	none , список эффектов затенения, перечисляемых через запятую; каждый эффект представлет собой набор из максимум четырех разделенных пробелами элементов, любой из которых можно опустить: цвет размер1 размер2 размер3 цвет - цвет тени; размер1 - смещение тени по горизонтали; размер2 - смещение тени по вертикали; размер3 - радиус размытия тени	none
letter-spacing	Межсимвольное расстояние	размер, normal	normal
word-spacing	Расстояние между словами	размер, normal	normal
text-transform	Преобразование текста	none, capitalize (первая буква каждого слова заглавная), uppercase (все буквы заглавные), lowercase (все буквы строчные)	none
line-height	Межстрочный интервал	normal , число, размер, процент (относительно размера текущего шрифта)	normal
white-space	Способ обработки символов пустого пространства внутри блока	normal, pre (не изменять символы пустого пространства ), nowrap (не разрывать строку)	normal

Свойства ссылок

<!doctype html>
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Ссылки</title>
	<style type="text/css">
		A:link { 
			text-decoration: none; /* Убирает подчеркивание для ссылок */
		} 
		A:visited { text-decoration: none; } 
		A:active { text-decoration: none; }
		A:hover {
			text-decoration: underline; /* Делает ссылку подчеркнутой при наведении на нее курсора */
			color: red; /* Цвет ссылки */
		} 
	</style>
</head> 
<body>
	<p><a href="1.html">Пример ссылки</a></p>
</body> 
</html>	

Используйте атрибут style для какого либо элемента если этот элемент с отличным от других элементов стилем один единственный на всём сайте.