![Элемент DOCTYPE синтаксис<!DOCTYPE [Элемент верхнего уровня] [Публичность] "[Регистрация]//[Организация]//[Тип] [Имя]//[Язык]" "[URL]">](https://image.slidesharecdn.com/html-110901005907-phpapp01/85/html-21-320.jpg)
More Related Content
What's hot (16)
Similar to Структура html документа (20)
Структура html документа
- 2. Общие сведения HTMLHyper Text Markup LanguageКод используется для создания Web сайтовПредставляет собой совокупность команд, которые называются тегамиИнтерпретируется браузерами и отображается в виде документаОбеспечивает презентационный уровень приложния
- 3. История HTML1991 – HTML теги1995 – HTML 2.01997 – HTML 3.21997 – HTML 4.01999 – HTML 4.012000 – XHTML 1.02001 – XHTML 1.12002 – XHTML 2.02000 – XHTML 1.02004 – HTML 5.0
- 4. Назначение HTMLтеговФорматирование текстаФорматирование таблиц и списковОрганизация ссылок на другие ресурсыОписание фреймовВставка изображений и мультимедиа
- 5. Формат HTMLтеговHTMLтег записывается в угловых скобках и состоит из имени за которым может следовать список атрибутовАтрибуты – элементы, которые дают браузеру дополнительную информацию об отображении расширяемой информацииБольшинство тегов имеют два компонента – открывающий и закрывающий теги(парные теги)Закрывающий компонент имеет то же название, но при записи перед названием ставится символ « / »
- 7. Назначение HTMLтегов<p class=“summary”>Это параграф</p>АТРИБУТ<p id=“main” class=“summary”>Это параграф</p>АТРИБУТАТРИБУТ
- 8. Назначение HTMLтегов<p class=“summary”>Это параграф</p>СОДЕРЖАНИЕ ЭЛЕМЕНТА
- 10. Структура HTMLдокументаТег <HTML> указывает программе просмотра страниц что это HTML документТег <HEAD> определяет место, где помещается различная информация не отображаемая в теле документа. Здесь располагается тег названия документаТег <TITLE> - тег названия документа. Текст внутри него отображается не на странице, а как заголовок окна браузера.Тег <BODY> определяет видимую часть документа.В этом разделе располагается вся содержательная часть документа (текст статьи, фотографии, формы для заполнения, другие объекты).
- 11. Структура HTMLзаголовка<head> <title>Заголовок</title><meta name=“description”>Описание сайта</meta> <meta name=“keywords”>фото, видео, музыка</meta><link type=“text/css” rel=“stylesheets” href=“style.css”> <script type=“text/javascript” src=/slideshow/html-9091663/9091663/“script.js”></script></head>
- 12. Тег METAОпределяет метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем. Например, механизмы поисковых систем обращаются к метатегам для получения описания сайта, ключевых слов и других данныхАтрибутыcharset – задает кодировку документаcontent – устанавливает значение атрибута, заданного с помощьюnameилиhttp-equivhttp-equiv– предназначендля конвертирования метатега в заголовок HTTPname – Имяметатега, также косвенно устанавливает его предназначение
- 13. Тег LINKУстанавливает связь с внешним документом вроде файла со стилями или со шрифтамиАтрибутыcharset – кодировка связываемого документаhref– путь к связываемому файлуrel – определяет отношения между текущим документом и файлом, на который делается ссылкаtype – MIME-тип данных подключаемого файла
- 14. Тег SCRIPTПредназначен для описания скриптов, может содержать ссылку на программу или ее текст на определенном языкеСкриптымогут располагаться во внешнем файле и связываться с любым HTML-документомТакой подход позволяет использовать одни и те же общие функции на многих веб-страницах и ускоряет их загрузку, т.к. внешний файл кэшируется при первой загрузке, и скрипт вызывается быстрее при последующих вызовахАтрибутыlanguage – устанавливает язык программирования на котором написан скрипт.src– адрес скрипта из внешнего файла для импорта в текущий документrel – определяет отношения между текущим документом и файлом, на который делается ссылкаtype – определяет тип содержимого тега
- 15. Элемент DOCTYPEПредназначен для указания типа текущего документа— DTD (documenttypedefinition, описание типа документа). Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (EXtensibleHyperTextMarkupLanguage, расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису. Чтобы браузер «не путался» и понимал, согласно какому стандарту отображать веб-страницу и необходимо в первой строке кода задавать<!DOCTYPE>.
- 18. Элемент DOCTYPEHTML 5<!DOCTYPE html>
- 19. Элемент DOCTYPE XHTML 1.0
- 20. Элемент DOCTYPE XHTML 1.1
- 21. Элемент DOCTYPE синтаксис<!DOCTYPE [Элемент верхнего уровня] [Публичность] "[Регистрация]//[Организация]//[Тип] [Имя]//[Язык]" "[URL]">
- 22. Типы элементовБлочный элемент (block element)Встроеный элемент (inline element)
- 23. Блочный элементБлочным называется элемент, который отображается на веб-странице в виде прямоугольникаТакой элемент занимает всю доступную ширину, высота элемента определяется его содержимым, и он всегда начинается с новой строкиК блочным элементам относятся контейнеры<div>,<h1>и<p>Допускается вкладывать один блочный элемент внутрь другого, а также размещать внутри них встроенные элементыЗапрещено добавлять внутрь встроенных элементов блочные
- 24. Блочный элемент<html><head><title>Блочные элементы</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8"></head><body><div><p>Параграф</p></div><h2><ahref="link1.html">Ссылка</a></h2></body></html>
- 25. Блочный элемент
- 26. Блочный элементБлочные элементы выступают в качестве основного строительного материала при верстке веб-страницТакие элементы характерны тем, что всегда начинаются с новой строки и занимают всю доступную ширину области, в которой располагаютсяСпецификация CSS определяет, что высота и ширина элемента определяется не только значениямиheightиwidth, но к ним еще плюсуется значение полей, отступов и границ. Браузеры в этом плане делятся на две части: одни поддерживают в этом вопросе спецификацию, другие же ее игнорируют и поступают по-своему. Это создает трудности разработчикам, которые желают делать универсальные веб-страницы.
- 27. Встроенный элементВстроенными называются такие элементы веб-страницы, которые являются непосредственной частью другого элемента, например, текстового абзацаК встроенным элементам относятся теги<span>,<a>,<q>,<code>и др.В основном они используются для изменения вида текста или его логического выделения.
- 28. Встроенный элемент<body><div><span class="pic"><imgsrc=/slideshow/html-9091663/9091663/"images/mail.gif" width="45" height="38" alt=""></span><span class="send">Отправить ссылку на эту статью другу</span></div></body>
- 30. Встроенный элементВстроенные элементы удобно использовать для изменения вида и стиля текста, в частности, отдельных символов и словДля этой цели обычно применяется универсальный тег<span>, который самостоятельно никак не модифицирует содержимое, но легко объединяется со стилями через классы или идентификаторыС помощью этого тега можно легко управлять видом и положением отдельных фрагментов текста или рисунков
- 31. Отличия inlineи blockэлементовВстроенные элементы могут содержать только данные или другие встроенные элементы, а в блочные допустимо вкладывать другие блочные элементы, встроенные элементы, а также данные. Иными словами, встроенные элементы никак не могут хранить блочные элементыБлочные элементы всегда начинаются с новой строки, а встроенные таким способом не акцентируютсяБлочные элементы занимают всю доступную ширину, например, окна браузера, а ширина встроенных элементов равна их содержимому плюс значения отступов, полей и границ