belarusweb.net
© Петр Романовский Минск, 2016-2017.



belarusweb.net

Основы создания сайтов...
HTML >>>

3.6. Тег <style>

Применение стилевых свойств к элементу разметки через атрибут style имеет силу только для одного элемента. Если нам понадобится применить их к другому элементу разметки, то придется повторно задать для него атрибут style с теми же значениями. Поэтому на практике данный способ применяется редко. Вместо этого чаще используется элемент 'style', который формируется при помощи пары тегов <style> и </style> и предназначен в основном для хранения внутренних таблиц стилей CSS, которые имеют силу во всем документе. Он является служебным элементом и располагается в заголовке документа. Разрешается использовать несколько элементов 'style' (см. пример 3.6).

<!DOCTYPE html>
<html>
<head>
	<!-- Сообщаем браузеру кодировку документа -->
	<meta charset="utf-8">	
	<!-- Не забываем про заголовок документа -->
	<title>Элемент 'style' и его атрибуты</title>
	
	<!-- Установим стиль всех абзацев (для всех устройств) -->
	<style type="text/css">
		p{
		background-color: yellow;
		color: blue;
		}
	</style>
	
	<!-- Установим стиль всех абзацев при распечатке документа -->
	<style type="text/css" media="print">
		p{
		background-color: blue;
		color: black;
		}
	</style>
</head>
<body>
  <p>
	Если меня захотят распечатать, то будет применен <br>
	синий фон и черный цвет шрифта. А так я отображаюсь <br>
	на желтом фоне синими буквами.
  </p>
</body>
</html>

Пример 3.6. Использование элемента 'style'

Атрибут media может принимать те же значения, что и в элементе 'link'. Второй атрибут type сообщает браузеру MIME-тип (тип данных) содержимого элемента. Это позволяет браузеру правильно интерпретировать код элемента. По умолчанию, type="text/css" и media="all", поэтому указывать их не обязательно, т.к. мы всегда будем применять элемент 'style' для размещения внутренних таблиц стилей CSS и, за редким исключением, применять для отображения документа на всех устройствах. Короче, элемент 'style' мы будем использовать, как обычный контейнер для размещения там таблиц стилей CSS.

Контрольные вопросы и задания

  1. Опишите элемент 'style'?

Словарь новых английских слов

target ['ta:git] – цель, назначение.
base [beɪs] – база, основа.
main [meɪn] – основной, главный.
link [lɪŋk] – звено, связь, связывать.
relation [ri'lei∫ən] – отношение, взаимосвязь.
media [ˈmiːdɪə] – носители, каналы, среды.
all [ɔːl] – все.
handheld [ˈhandhɛld] – портативный, переносной.
screen [skriːn] – экран.
size [saɪz] – размер, величина, объем.
content [kənˈtɛnt] – содержимое, содержание, суть.
author [ˈɔːθə] – автор, инициатор.
speech [spiːtʃ] – речь.
static [ˈstatɪk] – статичный, неподвижный,
стационарный.
state [steɪt] – состояние.
dynamic [dʌɪˈnamɪk] – динамичный, активный,
изменяющийся.
follow [ˈfɒləʊ] – следовать за.
revisit [riːˈvɪzɪt] – посетить вновь.
sheet [ʃiːt] – лист бумаги.
title [ˈtʌɪt(ə)l] – заглавие, название.
style [stʌɪl] – стиль, манера.
source [sɔːs] – источник.
asynchronously [ə'siɳkrənəsli] – асинхронно.

Комментарии (0)
Петр Романовский
1. Приветствуются комментарии, которые содержат дополнения к материалу текущей страницы, а также ваши ответы на вопросы других пользователей.
2. Если вам что-то непонятно - спрашивайте, не забывая написать, что именно и с какого места.
Показаны все комментарии
Чтобы оставить свой комментарий, авторизуйтесь, пожалуйста!    
     
belarusweb.net © Петр Романовский, Минск, 2016-2017.
Связаться с автором
Наверх