Проектируйте веб -страницы с использованием семантического кода HTML5

Автор：Eve Cole Время обновления：2025-03-27 06:00:02

Во -первых, мы хотим объявить и создать тип документа, мы больше не используем HTML 4 или XHTML 1.0, как Public -// W3C // DTD XHTML 1.0 Переход ..... объявление, мы можем написать таким образом:

 <! Doctypehtml>

Взгляните, это просто и очевидно, нечувствительно. Это облегчает быть обратно совместимым. По крайней мере, это может сэкономить вам некоторое время в печати.

Теперь мы определили тип для документа HTML 5. Пока все прошло хорошо. Теперь давайте посмотрим на новые теги для HTML5. Прежде чем мы рассмотрим новую вкладку, давайте посмотрим, как мы обычно пишем:

 <html>
 <голова>
 ...другой...
 </head>
 <тело>
 <divid = заголовок>
 <h1> css3-html5 home </h1>
 </div>
 <divid = Nav>
 <ul>
 <li> Дом </li>
 <li> О </li>
 <li> Свяжитесь с </li>
 </ul>
 </div>
 <divid = content>
 <h1> title </h1>
 <p> ... </p>
 </div>
 <divid = нижний колонтитул>
 <p> Информация об авторском праве </p>
 </div>
 </body>
 </html>

Использование <Div> в примере выше - очень распространенная практика. Его цель двойной. Во -первых, он предоставляет уникальный идентификационный идентификатор, который может быть применен специально к главам веб -страниц. Во-вторых, идентификация является примитивной псевдо-семантической структурой. Идентификаторы идентификации на каждом веб -сайте могут быть разными, поэтому нам трудно понять, что означают эти идентификаторы.

<Header> Tag:

Тег <Header> эквивалентен той, которую мы обычно определяем с помощью <div id = Header>. Если ваш веб -сайт все еще определяется таким образом с помощью <div id = заголовок>, теперь мы можем заменить его <Header>.

<av> Tag:

<Av> это тег навигации, как мы обычно используем:

<ul>

<li> Индекс </li>

<li> Новости </li>

...

</ul>

</div>

Теперь используйте <Av>:

 <av>
 <ul>
 <li> <ahref = index.html> home </a> </li>
 <li> <ahref =/about/about/about </a> </li>
 <li> <ahref =/blog/> blog </a> </li>
 </ul>
 </nav>

<section> тег: тег <section> может быть группой контента или тематических групп, обычно с тегом старта и конечным тегом. Конечно, этот тег также может быть вложенным.

<статья> тег: может быть раздел контента внутри тега <centle>.

<в сторону>

<chooler> Tag: <cooler> Tag, если вы не говорите этого, вы можете понять, для чего это. Также может быть несколько, обычно в нижней части сайта.

Давайте посмотрим на последний код:

 <! Doctypehtml>
 <html>
 <голова>
 ...вещи...
 </head>
 <тело>
 <заголовок>
 <h1> mysite </h1>
 </header>
 <av>
 <ul>
 <li> Дом </li>
 <li> О </li>
 <li> Свяжитесь с </li>
 </ul>
 </nav>
 <раздел>
 <h1> myarticle </h1>
 <статья>
 <p> ... </p>
 </article>
 </section>
 <нижний колонтитул>
 <p> ... </p>
 </cooler>
 </body>
 </html>

Через код это более кратко и легче понять, верно?