Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Информатика 2013.doc
Скачиваний:
0
Добавлен:
10.01.2020
Размер:
649.73 Кб
Скачать

24. Html. Стили css. Формы. Интерфейсы пользователя. Отчеты.

HTML (от англ. Hypertext Markup Language — «язык разметки гипертекста») — это стандартный язык разметки документов во Всемирной паутине. Практически все веб-страницы создаются при помощи языка HTML или его последователя — XHTML.

Формально HTML является приложением SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879.

HTML — это теговый язык разметки документов. Любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками — тегами. Элементы могут быть пустыми, то есть не содержащими никакого текста и других данных (например, тег перевода строки <br />). В этом случае обычно не указывается закрывающий тег. Кроме того, элементы могут иметь атрибуты, определяющие какие-либо их свойства (например, размер шрифта для элемента font). Атрибуты указываются в открывающем теге. Вот примеры фрагментов HTML-документа:

<strong>Текст между двумя тегами — открывающим и закрывающим.</strong>

<a href="http://www.example.com">Здесь элемент содержит атрибут href.</a> А вот пример пустого элемента: <br>

Регистр, в котором набрано имя элемента и имена атрибутов, в HTML значения не имеет (в отличие от XHTML). Элементы могут быть вложенными. Например, следующий код: <b> Этот текст будет жирным, <u>а этот ещё и подчёркнутым</u></b>

даст такой результат: Этот текст будет жирным, а этот ещё и подчёркнутым

Кроме элементов, в HTML-документах есть и сущности (англ. entities) — «специальные символы». Сущности начинаются с символа амперсанда и имеют вид &имя; или &#NNNN;, где NNNN — код символа в Юникоде в десятеричной системе счисления.

Например, © — знак авторского права (©). Как правило, сущности используются для представления символов, отсутствующих в кодировке документа, или же для представления «специальных» символов: & — амперсанда (&), < — символа «меньше» (<) и > — символа «больше» (>), которые некорректно записывать «обычным» образом, из-за их особого значения в HTML.

Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML <!DOCTYPE…>, которая обычно выглядит примерно так:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"

"http://www.w3.org/TR/html4/strict.dtd">

Если эта строка не указана, то добиться корректного отображения документа в браузере становится труднее.

Далее обозначается начало и конец документа тегами <html> и </html> соответственно. Внутри этих тегов должны находиться теги заголовка (<head></head>) и тела (<body></body>) документа.

СТИЛИ CSS. CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам, например, к SVG или XUL.

Таблицы стилей (style sheets) представляют собой абстракцию, в которой стиль документа определяется отдельно от его содержания. Термин "таблицы стилей"прочно вошел в русскую речь, хотя в некоторых книгах вы можете встретить и более точный перевод - "листы стилей".

По методам добавления стилей в документ различают три вида стилей.

Внутренние стили.Определяются атрибутом непосредственно в элементе. Мало отличается от традиционного HTML. Внешний вид документа трудно изменить.

<!-- каждому параграфу – свой цвет -->

</head><P style="color:blue">LET US TALK</P> <P style="color:red">LET US READ</P></html>

Глобальные стили.Определяются тэгом STYLE с атрибутом TYPE="text/css" в контейнере <HEAD>...</HEAD>, являются универсальным средством, позволяющим не только оперативно изменять внешний вид страницы, но и  и бороться с перегруженностью  документа оформительскими тэгами.

<!-- все параграфы лилового цвета -->

<html><head> <style type="text/css"> <!--P {color:#FF00FF}--></style>

<meta http-equiv="Content-Type" content="text/html;charset=windows-1251">

</head><P>LET US READ AND LEARN</P> <P>LET US READ AND LEARN</P></html>

Обратите внимание на то, что описание стиля заключено в тэги комментариев. Это сделано для того, чтобы броузеры, не понимающие, о чем идет речь, не вываливали описание стилей на страницу, как обычный текст

Связанные стили.Определяются во внешнем файле. Позволяют всем страницам, принадлежащим одному серверу выглядеть единообразно. Для связи с файлом, на котором описана таблица стилей, используется тэг <LINK> с атрибутом REL="stylesheet".

Другие атрибуты: - TITLE. Задает заголовок страницы, на которой с помощью тэга <STYLE>, определена таблица стилей.

- HREF. Ссылка на страницу с таблицей стилей или имя файла.

- TYPE. Тип файла, с которым нужно установить связь.