Спонсор: Microsoft
Саратовский государственный университет им. Н.Г. Чернышевского
Опубликован: 17.06.2010 | Доступ: свободный | Студентов: 3924 / 858 | Оценка: 4.52 / 4.19 | Длительность: 11:02:00
Лекция 5:

DOCTYPE и раздел документа HEAD

< Лекция 4 || Лекция 5: 123 || Лекция 6 >

Элемент STYLE

Элемент STYLE позволяет включать в документ внутренние таблицы стилей. Заголовок документа может содержать любое количество этих элементов. Обязательный атрибут type указывает на тип таблицы стилей, т.е. на язык, на котором описываются стили. Для каскадных таблиц стилей этот атрибут всегда должен иметь значение text/css.

Ниже представлен пример включения каскадных таблиц стилей в HTML-документ:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
  <TITLE>Пример использования элемента STYLE</TYTLE>
  <STYLE type="text/css">
    body{
      background:#000;
      color:#ccc;
      font-family: helvetica, arial, sans-serif;
    }
  </STYLE>
</HEAD>
<BODY>
<P>Информация к размышлению...</P>
</BODY>
</HTML>

HTML позволяет авторам создавать документы, учитывающие особенности устройств, на которых будет отображаться HTML-документ. К таким устройствам относятся принтеры, проекторы, устройства, предназначенные для людей с ограниченными физическими возможностями и др. Для того, чтобы использовать разные таблицы стилей для различных устройств, используется атрибут media. По умолчанию, значением данного атрибута является screen (т.е. предполагается, что документ будет отображаться на экране монитора).

В описанном выше примере можно переопределить используемые цвета и размер шрифта, чтобы страница лучше выглядела при печати. Для этого можно добавить другой блок STYLE с атрибутом media со значением print, как показано ниже:

<STYLE type="text/css" media="print">
  body{
    background:#fff;
    color:#000;
    font-family: helvetica, arial, sans-serif;
    font-size:300%;
  }
</STYLE>

Результат предыдущего примера представлен на рисунке 5.2, где применяется стиль с параметром media="screen". На рисунке 5.3 представлен результат предварительного просмотра той же страницы, однако при этом уже действует стиль для печати, заданный параметром media="print" .

Страница со стилем для просмотра на мониторе

Рис. 5.2. Страница со стилем для просмотра на мониторе

Страница со стилем для вывода на печать

Рис. 5.3. Страница со стилем для вывода на печать

Элемент SCRIPT

Элемент SCRIPT предназначен для добавления так называемых клиентских сценариев - сценариев, которые выполняются браузером и написаны на языке JavaScript. JavaScript добавляет динамическое поведение в статические документы HTML, например, эффекты анимации, или проверку данных формы, или другие функции, которые запускаются, когда пользователь выполняет определенные действия.

Элемент SCRIPT может располагаться в заголовке или теле HTML-документа в неограниченном количестве. Когда браузер встречает такой сценарий, он прекращает разбор оставшегося документа, пока не выполнит код сценария. Поэтому, чтобы гарантировать, что код JavaScript будет доступен до загрузки основного документа, его необходимо поместить в раздел HEAD .

Например, можно предупредить посетителя с помощью следующего сценария, что определенная ссылка отправит его на другой сервер:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
  <TITLE>Пример использования элемента SCRIPT</TITLE>
  <SCRIPT>
    function crossing(){
      return confirm("Вы готовы перейти на другой сервер?")
    }
  </SCRIPT>
</HEAD>
<BODY>
    <A href="http://www.somewhere.com" onclick="return crossing()"> Ссылка на другой сервер </A>
</BODY>
</HTML>

Если открыть этот пример в браузере и щелкнуть на ссылке, то код попросит подтвердить действие пользователя, как представлено на рисунке 5.4.

Пример использования элемента SCRIPT

Рис. 5.4. Пример использования элемента SCRIPT

< Лекция 4 || Лекция 5: 123 || Лекция 6 >
Елена Вноровская
Елена Вноровская
Максим Казначеев
Максим Казначеев
Скажите у всех отображается тест №1?
Александр Терещенко
Александр Терещенко
Россия