ITPub博客

首页 > > > HTML5语义化元素你真的用的正确吗

HTML5语义化元素你真的用的正确吗

作者:25minutes 时间:2019-08-27 11:29:55 0 删除 编辑

HTML5语义元素

语义学是研究语言中单词和短语的含义。语义元素=具有意义的元素。 语义元素清楚地描述了它对浏览器和开发人员的意义。 非语义元素的示例:<div>和<span>- 对其内容一无所知。 语义元素的示例:<form>,<table>和<article>- 清楚地定义其内容。 所有现代浏览器都支持HTML5语义元素。

HTML5新语义元素

许多网站都包含HTML代码,例如:<div id ="nav"> <div class ="header"> <div id ="footer"> 以指示导航,页眉和页脚。 HTML5提供了新的语义元素来定义网页的不同部分:

<article>

<aside>

<details>

<figcaption>

<figure>

<footer>

<header>

<main>

<mark>

<nav>

<section>

<summary>

<time>

HTML5 <section>元素

 元素定义了一个文档中的一个部分。 根据W3C的HTML5文档:“一个部分是内容的主题分组,通常带有标题。” 主页通常可以分为几个部分,用于介绍,内容和联系信息。

     <section>

       <h1>Java</h1>

       <p>Java是一种广泛使用的计算机编程语言</p>

     </section>

     <section>

       <h1>PHP</h1>

       <p>PHP是一种开源的通用计算机脚本语言,尤其适用于网络开发并可嵌入HTML中使用。</p>

     </section>

HTML5 <article>元素

 元素指定独立的包含内容。 一篇文章本身应该有意义,应该可以从网站的其他部分独立阅读。
可以使用元素的示例: 

论坛帖子 

博客文章 

报纸文章

       <article>

         <h1>Java</h1>

         <p>Java是一种广泛使用的计算机编程语言</p>

       </article>

HTML5 <header>元素

 元素指定为一个文件或部分标题。
元素应该用作介绍性内容的容器。 您可以在一个
中包含多个元素。 以下示例定义文章的标题:

       <article>

         <header>

           <h1>Java</h1>

           <p>Java是什么:</p>

         </header>

         <p>Java是一种广泛使用的计算机编程语言</p>

       </article>

HTML5 <footer>元素

 元素指定为一个文件或部分页脚。
元件应包含有关它的包含单元信息。 页脚通常包含文档的作者,版权信息,使用条款的链接,联系信息等。 您可在一个
中有多个元素。

       <footer>

         <p>版权所有</p>

         <p>联系信息: <ahref="mailto:someone@example.com">

         someone@example.com</a>.</p>

       </footer>

HTML5 <nav>元素

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4328/viewspace-3158917/ ,如需转载,请注明出处,否则将追究法律责任。

请登录后发表评论 登录
全部评论

注册时间:2019-07-17

  • 博文量
    336
  • 访问量
    14901