Содержание
Атрибут manifest | htmlbook.ru
Internet Explorer | Chrome | Opera | Safari | Firefox | Android | iOS |
8.0+ | 9.6+ | 4.0+ | 4.0+ | 2.1+ | 3.0+ |
Спецификация
HTML: | 3.2 | 4.01 | 5.0 | XHTML: | 1.0 | 1.1 |
Описание
Атрибут manifest реализует механизм кэширования, который позволяет создавать оффлайновые приложения, т.е. работающие в автономном режиме без непосредственного подключения к Интернету. При первой загрузке страницы браузер обычно просит сохранить данные для своей работы, а затем уже обращается к ним при необходимости.
В качестве значения атрибута manifest указывается относительный или абсолютный путь к текстовому файлу, он называется «файл манифеста» или просто «манифест». Имя и расположение файла может быть любым, но он должен отдаваться сервером с заголовком text/cache-manifest. Например, для веб-сервера Apache в файле .htaccess расположенным в корне сайта следует прописать такую строку.
AddType text/cache-manifest .cache
В этом случае файл манифеста имеет расширение cache. Сам манифест информирует браузер о том, какие ресурсы необходимо сохранить в локальном кэше. Этот список может содержать HTML и CSS-файлы, изображения, скрипты. Имена файлов перечисляются внутри секций описанных в табл. 1.
Раздел | Описание |
---|---|
CACHE MANIFEST | Этой обязательной строкой должен начинаться любой манифест. |
CACHE: | Содержит перечень ресурсов, которые браузер должен кэшировать. Данный раздел используется по умолчанию, если его не указать и нет других разделов, то записи в манифесте причисляются к этому разделу. |
NETWORK: | Список ресурсов, которые доступны только при подключении к сети. Обычно в этот раздел входят программы выполняемые на стороне сервера. |
FALLBACK: | Список замещающих файлов, которые будут использоваться при отсутствии подключения к сети. Допустимо использовать символ * для обозначения всех файлов. Например, *.php /offline.html означает, что вместо любого файла с расширением php будет показана страница offline.html. |
Синтаксис
<html manifest="URL">
Значения
В качестве значения указывается адрес файла манифеста.
Значение по умолчанию
Нет.
Пример 1
HTML5IECrOpSaFx
<!DOCTYPE html> <html manifest="22.cache"> <head> <meta charset="utf-8"> <title>22 хода</title> <link href="22.css" rel="stylesheet"> <script src="22.js"></script> </head> <body> <div> <h2>22 хода</h2> <canvas> <img src="images/old.png" alt=""> </canvas> <p>Ходов: <span>0</span> <span></span></p> <h4>Цель игры</h4> <p>Вам необходимо за 22 хода сгруппировать все серые фишки на кружках в верхнем квадрате, а чёрные фишки — в нижнем. Кружки с точкой должны оказаться незанятыми.</p> <p>Фишка может перемещаться только по линиям — по горизонтали или вертикали, а также перепрыгивать через фишку, если за ней есть свободное поле.</p> </div> </body> </html>
Содержимое файла 22.cache показано в примере 2.
Пример 2. Файл 22.cache
CACHE MANIFEST # Версия 1.0 CACHE: 22.css 22.js images/old.png
Статьи по теме
- Корневой элемент
Статьи по теме
- Возьмём с собой
- Руководство по использованию кэша приложения
Что такое HTML-теги — шпаргалка по основным меткам
Можно бесплатно и в режиме онлайн открыть ООО через Тинькофф и вести бухгалтерию через Мое дело
х
Наверх
- Главная
- Создание сайта на HTML
- HTML-теги
Тег — это специальное зарезервированное слово, заключённое в угловые скобки (например, <body>). Тег — основная составляющая HTML: им код начинается, им же заканчивается, внутри тегов заключается отображаемая на веб-странице информация. Записывать их рекомендуется в нижнем регистре, то есть обычными маленькими буквами: не <THEAD>, а <thead>.
Какими бывают теги?
Большинство HTML-тегов являются парными: есть открывающий (например, <html>) и закрывающий тег, который от открывающего отличает слеш (/) после первой угловой скобки (например, </html>). Всё, что находится внутри пары тегов, называется их содержимым.
<Открывающий_тег>Содержимое</Закрывающий_тег> <b>Помещённый внутри этих тегов текст становится жирным</b>
Бывают и непарные (одиночные) теги, которые называются метками. Их, в отличие от парных тегов, не нужно закрывать, потому что они не работают с содержимым, а выполняют какую-то функцию сами по себе. Пример одиночного тега — <br>. Он устанавливает перенос текста на следующую строку.
Если проводить параллели с русским языком, то можно сказать, что парные теги — это кавычки или скобки, влияющие на свойства заключённого в них текста (попробуйте не закрыть кавычки вовремя), а одиночные теги (метки) — это знаки препинания (восклицательный, вопросительный или точка).
Любой тег состоит из:
- Открывающей угловой скобки (<).
- Специального слова (имени тега). Например, hr, iframe, b.
- Закрывающей угловой скобки (>).
Основные HTML-теги
Так как теги — основа языка разметки, не удивительно, что их довольно много. Рассмотрим основные, самые важные теги.
- <!—…—> — одиночный тег, внутри которого размещается комментарий. Комментарий — это текст, который не обрабатывается браузером. Внутри тега можно писать, что угодно, даже другие теги — работать они не будут, на экране не отобразятся. Разработчики комментируют код либо чтобы другим веб-мастерам было проще в нём разобраться, либо чтобы спустя продолжительное время его быстро смогли понять они сами.
- <html>, <!DOCTYPE>, <head>, <body>, <title> — теги, которые должны присутствовать в любом приличном HTML-документе (подробнее см. «Как создать сайт в Блокноте»).
- <meta> — тег содержит вспомогательную информацию для браузеров и поисковиков. Внутри него можно прописать ключевые слова, описание страницы, кодировку документа, имя автора и т. д.
- <script> содержит ссылку на файл сценария или сам код.
- <style> — тег, задающий стиль документа и/или его элементов с помощью CSS. HTML-документ может содержать множество тегов <style>, определяющих разные стили разных частей страницы.
- <header> — полная противоположность <footer>, его дополняющая. Тег задаёт «шапку» (заголовок) раздела или всей страницы.
- <footer> хранит в себе «ноги» сайта или раздела. Внутри него можно разместить вспомогательную информацию, копирайт, контактные данные и т. д.
- <main> содержит основной контент страницы. Ни шапку, ни блок меню, ни «ноги» сайта, а то, ради чего страница создавалась. Например, на странице, которую вы сейчас читаете, внутри <main> должна располагаться как раз эта статья.
- <a> предназначен для создания ссылок. Ссылки — корень гипертекста, поэтому им посвящена отдельная статья.
- <img> нужен для добавления на веб-страницу картинок (к вашим услугам посвящённая этому действу статья).
- <blockquote>, <br>, <hi1>-<hi6>, <hr>, <i>, <p>, <s>, <strong>, <ins> и другие теги форматирования текста составляют большую группу HTML-тегов, о них рассказывает статья «Форматирование текста в HTML».
- <div> — блочный элемент. Текст внутри <div></div> форматируется с помощью CSS (каскадных таблиц стилей, которым посвящена вторая часть самоучителя).
- <span>. У вас есть абзац <p> или блок <div>. Текст в нём оформлен в едином стиле, но вы бы хотели, не нарушая структуры, сделать так, чтобы несколько слов имели другой размер шрифта или цвет. Именно для таких ситуаций и предназначен тег <span>.
- <ol>, <ul>, <li> — теги списков. Маркированные, нумерованные — работа этих тегов. Есть ещё списки определений, за которые отвечают теги <dd>, <dt> и <dl>, но подробно обо всей это шестёрке вы узнаете из статьи «Создание списков».
- <table>, <tbody>, <thead>, <td>, <th> и <tr> используются при создании таблиц и подробно рассматриваются в отдельной статье.
- <form> — тег, добавляющий странице интерактивности, то есть позволяющий пользователю взаимодействовать с веб-сайтом. Конечно, форме необходим обработчик, но зато с помощью тегов внутри <form></form> вы можете создать интерфейс. Флажки, кнопки, переключатели, поля ввода и другие объекты, которые требуют от вас активных действий — всё это элементы формы, код которых размещается внутри контейнера <form>.
- <button> — тег, создающий интерактивную кнопку. Чтобы при нажатии на неё что-нибудь произошло, кнопка должна находиться в форме (располагаться между тегами <form></form>).
- <input> создаёт элементы формы: переключатели, флажки, кнопки, всевозможные поля ввода. Вставляется в контейнер <form>. Но зачем нам тогда отдельно <button>, если есть универсальный <input>? <button> позволяет создать кнопку с расширенными параметрами. Например, на кнопке <button> можно разместить картинку. На элементе, созданном через <input>, такого сделать нельзя.
- <menu> и <command> — теги создания меню в HTML 5. <menu> — это контейнер, внутри которого помещаются элементы <command>, добавление которых и приводит к созданию пунктов меню. Довольно интересная парочка. Например, с её помощью вы можете создать собственное контекстное меню для страницы или отдельного её элемента.
- <textarea> — ещё один тег формы, создающий в ней большое поле, в которое можно вводить не одну строку текста, а целые абзацы.
Полезные ссылки:
- Основы HTML — бесплатный 2-х часовой видеокурс по основам HTML;
- Бесплатный курс по верстке сайта — пример блочной вёрстки с чистого листа;
- Вёрстка сайта с нуля 2.0 — полноценный платный курс;
- Создание приложений для Android — для тех, кто давно хотел попробовать себя в мобильной разработке (не для новичков).
Смотрите также
Основные HTML-теги
Атрибуты HTML-тегов
HTML тег html
❮ Предыдущий
Полный справочник HTML
Далее ❯
Пример
Простой HTML-документ:
Это заголовок
Это абзац.
тело>
Попробуйте сами »
Определение и использование
Тег
представляет корень документа HTML.
Тег
является контейнером для всех остальных элементов HTML (кроме
тег ).
Примечание: Вы всегда должны включать
атрибут lang внутри
тег, чтобы объявить язык веб-страницы. Это сделано для помощи в поиске
движки и браузеры.
Поддержка браузера
Элемент | |||||
---|---|---|---|---|---|
Да | Да | Да | Да | Да |
Атрибуты
Атрибут | Значение | Описание |
---|---|---|
xмлн | http://www. w3.org/1999/xhtml | Указывает атрибут пространства имен XML (если вам нужно, чтобы ваш контент соответствовал XHTML) |
Глобальные атрибуты
Тег
также поддерживает глобальные атрибуты в HTML.
Связанные страницы
Учебник HTML: HTML Введение
HTML DOM Ссылка: HTML Object
Настройки CSS по умолчанию
Большинство браузеров будут отображать .0003
html {
display: block;
}
html:focus {
контур: нет;
}
❮ Предыдущий
Полный справочник HTML
Следующий ❯
ВЫБОР ЦВЕТА
Лучшие учебники
Учебное пособие по HTML
Учебное пособие по CSS
Учебное пособие по JavaScript
Учебное пособие
Учебное пособие по SQL
Учебное пособие по Python
Учебное пособие по W3.CSS
Учебное пособие по Bootstrap
Учебное пособие по PHP
Учебное пособие по Java
Учебное пособие по C++
Учебное пособие по jQuery
Основные ссылки
HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3. CSS Reference
Bootstrap Reference
PHP Reference
HTML Colors
Java Reference
Angular Reference
jQuery Reference
901 23 лучших примера
Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery
FORUM |
О
W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения.
Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания.
Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования,
куки-файлы и политика конфиденциальности.
Авторское право 1999-2023 по данным Refsnes. Все права защищены.
W3Schools работает на основе W3.CSS.
Тег HTML i
❮ Назад
Полный справочник HTML
Далее ❯
Пример
Разметка текста, который отличается от обычной прозы в документе:
Lorem ipsum — самый популярный текст-заполнитель в истории.
Роскошный пароход RMS Titanic затонул 15 апреля в 1912 г.
после столкновения с айсбергом.
Попробуйте сами »
Определение и использование
Тег
определяет часть текста с другим голосом или настроением.
Содержимое внутри обычно отображается курсивом .
Тег
часто используется для обозначения технического термина, фразы из другого
язык, мысль, название корабля и т. д.
Используйте элемент
только в том случае, если нет более подходящего семантического элемента, например:
- (выделенный текст)
- (важный текст)
- <метка> (выделенный/выделенный текст)
- <цитировать> (название произведения)
- (термин определения)
Поддержка браузера
Элемент | |||||
---|---|---|---|---|---|
<я> | Да | Да | Да | Да | Да |
Глобальные атрибуты
Тег
также поддерживает глобальные атрибуты в HTML.
Атрибуты событий
Тег
также поддерживает атрибуты событий в HTML.
Связанные страницы
Учебник HTML: Форматирование текста HTML
Ссылка HTML DOM: Курсив
Настройки CSS по умолчанию
Большинство браузеров будут отображать элемент
со следующими значениями по умолчанию:
Пример
i {
стиль шрифта: курсив;
}
Попробуйте сами »
❮ Предыдущая
Полный справочник HTML
Следующий ❯
ВЫБОР ЦВЕТА
Лучшие учебники
Учебное пособие по HTML
Учебное пособие по CSS
Учебное пособие по JavaScript
Учебное пособие
Учебное пособие по SQL
Учебное пособие по Python
Учебное пособие по W3.CSS
Учебник по Bootstrap
Учебник по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery
Лучшие ссылки
HTML Reference
CSS Reference
JavaScript Reference
SQL Reference
Python Reference
W3.