Main html что это
Перейти к содержимому

Main html что это

  • автор:

Тег main, основное содержание

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

И первый такой тег — это тег . Он выделяет основное содержание страницы, которое не повторяется на других страницах. И обычно на странице используется один .

 
Привет, я основной контент! Живу только на этой странице.

Наш сайт будет состоять из нескольких страниц. На каждой из них будут повторяющиеся шапка и подвал, а также уникальный контент страницы. Вот его и заключим в тег .

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

Спецификация не допускает использование на одной странице более одного тега , если у них нет специального атрибута hidden . Этот атрибут добавляется HTML-элементу, например, в одностраничных приложениях (Single Page Application), чтобы менять содержимое страницы, делая видимым тот или иной в разных состояниях приложения. Атрибут hidden указывает браузеру, что элемент не должен отображаться и использоваться в момент, когда отображается и используется содержимое другого .

Перейти к заданию

  • index.html Сплит-режим

Сайт начинающего верстальщика Всем привет! Добро пожаловать на мой первый сайт. Ещё недавно я понятия не имел, кто такой верстальщик, а теперь я нашёл тренажёры по HTML и CSS и поставил перед собой цель — стать им. У меня даже появился инструктор — Кекс, который не позволит мне расслабиться и будет следить за моими успехами. Моё первое задание — вести дневник и честно писать обо всех своих свершениях.

Проверить на сервере Проверка проводилась слишком много времени, попробуйте ещё разок Показать ответ

Спасибо! Мы скоро всё исправим)

Main html что это

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

Синтаксис

Атрибуты

Для этого тега доступны только универсальные атрибуты.

Закрывающий тег

HTML5 IE Cr Op Sa Fx

    main  

Следы невиданных зверей

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

Статьи по теме

Статьи по теме

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Что такое main в HTML5?

HTML тег

используется для обозначения основной части сайта. Этот тег никак не изменяет текст в нем или же объекты. Его задача состоит в простом обозначение основной части, в которой не находиться шапка, меню, подвал, сайдбар (боковая панель). Требует закрывающий тег
.

Многие браузеры не поддерживают этот тег, тем не менее они корректно его обрабатывают и выводят его содержимое.

Атрибуты:

  • У этого тега нет специальных атрибутов, но вы можете использовать все универсальные теги, такие как title.

Пример:

  
Шапка сайта

Важный заголовок!

Какие-нибудь статьи или прочее.
Подвал сайта

HTML тег

Тег — новый блочный элемент в спецификации HTML5, который предназначен для размещения основного контента документа. Содержимое тега должно быть уникальным и не дублировать однотипные блоки, которые повторяются в других документах, таких как шапка сайта (header), нижний колонтитул (footer), меню, форма поиска, информация об авторских правах и т.д.

Синтаксис

Содержимое тега размещается между открывающим (

) и закрывающим (
) тегами.

Пример

html> html> head> title>Заголовок документа title> head> body> main> h1>Языки программирования h1> p>Языки HTML и CSS предназначены для верстки сайтов. p> article> h2>HTML h2> p>HTML (Hyper Text Markup Language) - язык гипертекстовой разметки, который используется для создания веб-страниц. p> p>. p> p>. p> article> article> h2>CSS h2> p>CSS это язык стилей, определяющий отображение HTML-документов. p> p>. p> article> main> body> html>

Результат

mainexample1

Атрибуты

Как добавить стиль к тегу ?

Распространенные свойства для изменения визуальной насыщенности/выделения/размера текста внутри тега :

  • CSS свойство font-style задает стиль шрифта: normal | italic | oblique | initial | inherit
  • CSS свойство font-family создает приоритетный список названий семейства шрифтов и/или общее имя шрифтов для выбранных элементов.
  • CSS свойство font-size задает размер щрифта.
  • CSS свойство font-weight устанавливает насыщенность шрифта.
  • CSS свойство text-transform задает регистр текста (заглавные или строчные буквы).
  • CSS свойство text-decoration устанавливает оформление текста. Оно является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.

Цвет текста внутри тега :

  • CSS свойство color определяет цвет контента и оформления текста.
  • CSS свойство background-color устанавливает фоновый цвет элемента.

Стили форматирования текста для тега :

  • CSS свойство text-indent указывает размер отступа первой строки в текстовом блоке.
  • CSS свойство text-overflow указывает, как будет отображаться пользователю строчный текст, выходящий за границы блока.
  • CSS свойство white-space указывает, как будут отображены пробелы внутри элемента.
  • CSS свойство word-break указывает перенос строки.

Другие свойства для тега :

  • CSS свойство text-shadow добавляет тень к тексту.
  • CSS свойство text-align-last выравнивает последнюю строку текста.
  • CSS свойство line-height устанавливает межстрочный интервал.
  • CSS свойство letter-spacing устанавливает расстояние между буквами/символами в тексте.
  • CSS свойство word-spacing устанавливает расстояние между словами в тексте.

Поддержка браузера

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *