文档章节

新增主体结构元素section元素

 爱维
发布于 2015/02/11 13:23
字数 498
阅读 1
收藏 0

今天我们一起来学习一下section元素:

<!DOCTYPE HTML>

<html>

<body>

   <section>

   <h2>section元素使用方法</h2>

    <p> section元素用于对网站或应用程序中页面上的内容进行分块。</p>

   </section>

</body>

 </html>

article元素(例子如下):

<!DOCTYPE HTML>

<html>

<body>

<article> 

  <header>   

<h1> apple教程</h1>  

  <p>时间:<time pubdate="pubdate">2013-2-1</time></p>  

</header>  

<p>高档服装定制就来</p>

<a href=http://www.everclub.cn>www.everclub.cn</a><br />  

<footer> 

   <p><small>底部版权信息:apple.com公司所有</small></p>  

</footer> 

</article>

</body>

</html>

article元素的嵌套(例子如下):

<!DOCTYPE HTML>

<html>

<body>

<article>  

    <header>        

    <h1>article元素的嵌套</h1>          

  <p>发表日期:<time pubdate="pubdate">2012/10/10</time></p>     

  </header>     

  <p>article元素是什么?怎样使用article元素?……</p>   

   <section>        

    <h2>评论</h2>           

<article>              

    <header>                 

       <h3>发表者:唯一 </h3>                  

      <p><time pubdate datetime="2011-12-23T:21-26:00">1小时前</time></p>            

     </header>            

      <p>这篇文章很不错啊,顶一下!</p>      

      </article>         

   <article>              

    <header>                   

     <h3>发表者:唯一</h3>                   

     <p><time pubdate datetime="2013-2-20 T:21-26:00">1小时前</time></p>             

     </header>           

       <p>这篇文章很不错啊</p>       

     </article>    

  </section>

</article>

</body>

</html>

aside元素(例子如下):

<!DOCTYPE html> 

<html> 

<head>  

<title>标题文件</title>  

<link rel="stylesheet" href="mystyles.css"><!--rel 属性指示被链接的文档是一个样式表,rel属性规定当前文档与被链接文档之间的关系-->

 </head>

 <body>  

<header>    

<h1>站点主标题</h1>

  </header>  

<nav><!--<nav> 标签定义导航链接的部分--> 

    <ul>     

  <li>主页</li>    

  <li>图片</li>     

  <li>音频</li>  

   </ul>  

</nav>  

<section> 

</section> 

  <aside>    

<blockquote>文章1</blockquote>    

<blockquote>文章2</blockquote>  

</aside>

</body>

 </html>

nav元素(例子如下):

<!DOCTYPE html>

<html>

<body>

<h1>Time元素</h1>

<p id="p1">

  <time datetime="2013-3-17"> 今天是2013年3月17日   </time> 

</p>

 <p id="p2"> 

<time datetime="2013-3-17T17:00"> 现在时间是2013年3月17日晚上5点   </time>

 <p>

<p id="p3">  

<time datetime="2013-12-31">     新款冬装将于今年年底上市    </time>

 </p> 

<p id="p4">   

<time datetime="2013-3-15" pubdate="true">     本消息发布于2013年3月15日     </time>

 </p>

</body>

</html>

 

© 著作权归作者所有

上一篇: ‍聚焦什么是CDN
下一篇: ‍聚焦什么是CDN
粉丝 0
博文 2
码字总数 849
作品 0
苏州
私信 提问
第三章 HTML 5的结构-《HTML5+CSS3权威指南》

这章还是蛮重要的,主要是讲解了结构元素和使用结构元素合理编排页面总体布局。 HTML5中新增加了主体结构函数和非主体结构函数。 主体结构函数 Article元素 Articel元素代表文档、页面或应用...

产品哥
2011/12/06
0
0
HTML、CSS学习(一)语义化的Html

语义化的Html 一、什么是语义化的Html 语义化,就是要根据网页中具体的内容,选择合适的标签。即根据内容的结构化(内容语义化),选择合适的标签(代码语义化),以便于开发者阅读和写出更优...

AzureMonkey
2018/12/30
0
0
HTML5常用元素与属性

HTML5规范保持了对现有HTML的最大兼容,并保留了绝大部分元素和属性,HTML推荐使用CSS来控制HTML文档样式 一、HTML5保留的常用元素 1、基本元素 HTML保留的基本元素有如下几个: <!-- -->: ...

阿振
2015/10/13
162
0
article元素与section元素区别详解

作者:潜行者M | 时间:2012年03月26日 | 原文地址:http://www.qianxingzhem.com/post-915.html article元素与section元素是html5中新增的两种元素,它们的功能与div是一样的,都是用来区分...

潜行者M
2012/03/27
0
0
HTML5与HTML4的区别?

HTML5和HTML4在基本语法上的区别? 1. 内容类型(ContentType) HTML5中的文件扩展符仍然为".html" 或 ".htm",内容类型仍然为"text/html"。 2. DOCTYPE声明 HTML4: HTML5: 3. 指定的字符编码......

w-rain
2016/08/30
73
2

没有更多内容

加载失败,请刷新页面

加载更多

Angular 英雄编辑器

应用程序现在有了基本的标题。 接下来你要创建一个新的组件来显示英雄信息并且把这个组件放到应用程序的外壳里去。 创建英雄组件 使用 Angular CLI 创建一个名为 heroes 的新组件。 ng gener...

honeymoose
今天
4
0
Kernel DMA

为什么会有DMA(直接内存访问)?我们知道通常情况下,内存数据跟外设之间的通信是通过cpu来传递的。cpu运行io指令将数据从内存拷贝到外设的io端口,或者从外设的io端口拷贝到内存。由于外设...

yepanl
今天
6
0
hive

一、hive的定义: Hive是一个SQL解析引擎,将SQL语句转译成MR Job,然后再在Hadoop平台上运行,达到快速开发的目的 Hive中的表是纯逻辑表,就只是表的定义,即表的元数据。本质就是Hadoop的目...

霉男纸
今天
3
0
二、Spring Cloud—Eureka(Greenwich.SR1)

注:本系列文章所用工具及版本如下:开发工具(IDEA 2018.3.5),Spring Boot(2.1.3.RELEASE),Spring Cloud(Greenwich.SR1),Maven(3.6.0),JDK(1.8) Eureka: Eureka是Netflix开发...

倪伟伟
昨天
13
0
eclipse常用插件

amaterasUML https://takezoe.github.io/amateras-update-site/ https://github.com/takezoe/amateras-modeler modelGoon https://www.cnblogs.com/aademeng/articles/6890266.html......

大头鬼_yc
昨天
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部