Лекция: Доктайп

Теги

Для обозначения начала и конца элемента применяются теги. Внутри тегов могут быть атрибуты со своими значениями, расширяющими возможности тегов, а также содержимое (рис. 1).

Рис. 1. Тег <a> с атрибутом href

Закрывающий тег похож на открывающий, но содержит слэш (/) внутри угловых скобок.

Пустые элементы не имеют закрывающего тега и содержимого (рис. 2).

Рис. 2. Пустой тег <img>

Атрибуты тегов расширяют возможности самих тегов и позволяют гибко управлять различными настройками отображения элементов веб-страницы. Общее количество атрибутов достаточно велико, но их значения, как правило, можно сгруппировать по разным типам, например, задающих цвет, размер, адрес и др. Например, элемент <img> добавляет на веб-страницу изображение, при этом адрес графического файла мы указываем через атрибут src.

Доктайп

Вот HTML5 тег доктайп, его необходимо вставлять в самом начале.

<!DOCTYPE html>

Если интересно почему (если нет, можно пропустить абзац курсивом): Это длинная история с черной магией, стоящая за доктайпом. Во время работы над Internet Explorer 5 под Mac его разработчики столкнулись с неожиданной проблемой. Новая версия этого браузера содержала столько улучшений по части стандартов, что старые страницы отображались некорректно. Вернее, отображались они надлежащим образом, по спецификации, но люди считали, что отображаются они неправильно. Авторы страниц при верстке ориентировались на доминирующие браузеры того времени — Netscape 4 и Internet Explorer 4. Браузер IE5/Mac был настолько передовым, что фактически разрушил Сеть.В Майкрософте пришли к оригинальному решению. Перед отображением страницы, IE5/Mac смотрит на доктайп, который, как правило, стоит в первой строке кода (еще до элемента <html>). Старые страницы, которые ориентировались на «причуды» старых браузеров, обычно не имеют доктайпа, поэтому IE5/Mac отображал их подобно этим браузерам. Для включения поддержки новых стандартов, авторы страниц должны были вставить <!DOCTYPE>перед <html>.Эта идея распространилась как лесной пожар и вскоре все основные браузеры имели два режима: «режим совместимости» и «стандартный режим».

HTML-страница — это набор вложенных элементов, по своей структуре напоминающей дерево. Некоторые элементы являются «родственными», подобно ветвям, выходящим из одного ствола. Другие элементы «дочерние» для других элементов, как маленькая ветвь, растущая из большой ветки. Самый главный элемент, который выступает предком для всех остальных, зовется «корневым». В HTML-документе корневым всегда является <html>.

Элемент <head>

Первый дочерний элемент в корне это, как правило, тег <head>. Элемент <head> содержит метаданные — информацию о странице, но не тело самой страницы, которое располагается в <body>.

тег <meta>.

Каждый фрагмент текста, который вы когда-либо видели на экране компьютера, на самом деле хранится в определенной кодировке. Всякий раз, когда кто-то дает вам последовательность байтов и утверждает что это «текст», вы должны знать, какую кодировку символов они использовали, чтобы суметь перевести байты в символы и вывести их.

<meta charset=«utf-8» />

Метатег – это способ указания кодировки.

тег <title> указывает название страницы

тег <script>

Скрипты позволяют добавлять интерактивности на веб-страницу,

тег <body> далее следует тело, где содержится контент. В теле есть различные теги, определяющие структуру страницы, вот пример:

 

Итак, существуют атрибуты тегов, теги, позволяющие форматировать текст и его расположение. Но хоть HTML и справляется с оформлением страниц, этого очень мало! Существует инструмент куда мощнее – CSS, так называемые, каскадные таблицы стилей. Куда удобнее «отделить» оформление от логической структуры сайта. Html код, загроможденный тегами форматирования текста очень трудно читается, а еще труднее с ним работать. В CSS все находится в одном месте, да и сделать с его помощью можно куда больше.

Стиль определяется в самом документе и обычно располагается в заголовке веб-страницы. По своей гибкости и возможностям этот способ использования стиля уступает предыдущему, но также позволяет размещать все стили в одном месте. В данном случае, прямо в теле документа. Определение стиля задается тегом<style>

еще рефераты
Еще работы по информатике