HTML5深入浅出教学篇之三

介绍

10年积累的网站建设、成都做网站经验，可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你，你也不认识我。但先网站制作后付款的网站建设流程，更有临猗免费网站建设让你可以放心的选择与我们合作。

HTML 5: 内容分组元素

内容分组元素 - p, hr, pre, blockquote, ul, ol, li, dl, dt, dd, figure, figcaption, div

示例

1、p - 用于定义段落（p 是 paragraph 的缩写）element/group/p.html

 
 
 
    
  
  
  
  1.  
    2.   
  
  
  2.  
    3.   
  
  
  3.  
    4.   
  
  
  4.     p 
    5.   
  
  
  5.  
    6.   
  
  
  6.  
    7.   
  
  
  7.      
    8.   
  
  
  8.     
     
    9.   
  
  
  9.         段落1  
    10.   
  
  
  10.     
     
    11.   
  
  
  11.     
     
    12.   
  
  
  12.         段落2  
    13.   
  
  
  13.     
     
    14.   
  
  
  14.     
     
    15.   
  
  
  15.         段落3  
    16.   
  
  
  16.     
     
    17.   
  
  
  17.  
    18.   
  
  
  18.  
    19.

2、hr - 水平线，用于分隔文档的不同部分element/group/hr.html

 
 
 
    
  
  
  
  1.  
    2.   
  
  
  2.  
    3.   
  
  
  3.  
    4.   
  
  
  4.     hr 
    5.   
  
  
  5.  
    6.   
  
  
  6.  
    7.   
  
  
  7.     
     
    8.   
  
  
  8.         我是一段完整且独立的内容1  
    9.   
  
  
  9.      
    10.   
  
  
  10.  
    11.   
  
  
  11.      
    12.   
  
  
  12.      
    13.   
  
  
  13.  
    14.   
  
  
  14.     
     
    15.   
  
  
  15.         我是一段完整且独立的内容2  
    16.   
  
  
  16.      
    17.   
  
  
  17.  
    18.   
  
  
  18.  
    19.

3、pre - 用于定义预定义格式文本（空格和换行都会被保留）element/group/pre.html

 
 
 
    
  
  
  
  1.  
    2.   
  
  
  2.  
    3.   
  
  
  3.  
    4.   
  
  
  4.     pre 
    5.   
  
  
  5.  
    6.   
  
  
  6.  
    7.   
  
  
  7.      
    8.   
  
  
  8.     
     
    9.   
  
  
  9. 我是一段预定义格式文本  
    10.   
  
  
  10. 我的换行和                   空格都会被保留  
    11.   
  
  
  11.  
    12.   
  
  
  12. if (true)  
    13.   
  
  
  13.     write("true");  
    14.   
  
  
  14.     
 
  •  
  •  

    • 4、blockquote - 用于定义一段引用的内容（长内容）element/group/blockquote.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     blockquote 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     从 http://webabcd.cnblogs.com 里引用的一段长内容 
      9.   
  
  
    9.  
      10.   
  
  
    10.      
      11.   
  
  
    11.  
      12.   
  
  
    12.  
      13.

    5、ul - 用于定义无序列表（ul 是 unorder list 的缩写），li - 用于定义列表项（可在 ul 或 ol 或 menu 内）（li 是 list item 的缩写）element/group/ul_li.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     ul li 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
           
  
  
      •         
      • item01
        •    
  
  
      •         
      • item02
        •    
  
  
      •         
      • item03
        •    
  
  
      •     
       
      9.   
  
  
    9.  
      10.   
  
  
    10.  
      11.

    #p#

    6、ol - 用于定义有序列表（ol 是 order list 的缩写），li - 用于定义列表项（可在 ul 或 ol 或 menu 内）（li 是 list item 的缩写）element/group/ol_li.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     ol li 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
           
  
  
      1.         
      2. item01
        3.    
  
  
      3.         
      4. item02
        5.    
  
  
      5.         
      6. item03
        7.    
  
  
      7.     
       
      9.   
  
  
    9.  
      10.   
  
  
    10.      
      11.   
  
  
    11.         
    12. item01
      13.    
  
  
    13.         
    14. item02
      15.    
  
  
    15.         
    16. item03
      17.    
  
  
    17.     
       
  
  
  •  
    •   
  
  
  •      
    •   
  
  
  •         
  • item01
    •    
  
  
  •         
  • item02
    •    
  
  
  •         
  • item03
    •    
  
  
  •      
    •   
  
  
  •  
    •   
  
  
  •      
    •   
  
  
  •         
  • item01
    •    
  
  
  •         
  • item02
    •    
  
  
  •         
  • item03
    •    
  
  
  •      
    •   
  
  
  •  
    •   
  
  
  •      
    •   
  
  
  •         
  • item01
    •    
  
  
  •         
  • item02
    •    
  
  
  •         
  • item03
    •    
  
  
  •      
    •   
  
  
  •  
    •   
  
  
  •  
    •

    7、dl - 定义列表（definition list），dt - 定义列表中的标题（definition title），dd - 对定义列表中的标题的描述（definition description）element/group/dl_dt_dd.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     dl dt dd 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
       
      9.   
  
  
    9.         
      饮料
       
      10.   
  
  
    10.         
      很甜，很甜，喝了会发胖
       
      11.   
  
  
    11.         
      牛奶
       
      12.   
  
  
    12.         
      好喝，好喝，但是太贵了
       
      13.   
  
  
    13.         
      咖啡
       
      14.   
  
  
    14.         
      太苦，太苦，像感冒冲剂
       
      15.   
  
  
    15.      
      16.   
  
  
    16.  
      17.   
  
  
    17.  
      18.

    8、figure - 整合相关元素element/group/figure.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     figure 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
       
      9.   
  
  
    9.         
      学 html 5 有用吗？
       
      10.   
  
  
    10.         
      我正在学习 html 5，对它的未来充满信心
       
      11.   
  
  
    11.      
      12.   
  
  
    12.  
      13.   
  
  
    13.  
      14.

    9、figcaption - figure 元素的标题，它应该是 figure 的第一个子元素或最后一个子元素element/group/figcaption.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     figcaption 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
       
      9.   
  
  
    9.         
      html 5
       
      10.   
  
  
    10.         
      学 html 5 有用吗？
       
      11.   
  
  
    11.         
      我正在学习 html 5，对它的未来充满信心
       
      12.   
  
  
    12.      
      13.   
  
  
    13.  
      14.   
  
  
    14.  
      15.

    10、div - 没有任何语义（div 是 division 的缩写）element/group/div.html

     
 
 
      
  
  
  
    1.  
      2.   
  
  
    2.  
      3.   
  
  
    3.  
      4.   
  
  
    4.     div 
      5.   
  
  
    5.  
      6.   
  
  
    6.  
      7.   
  
  
    7.      
      8.   
  
  
    8.     
       
      9.   
  
  
    9.         我没有任何语义  
      10.   
  
  
    10.     
     
  •  
  •  

    • [源码下载]

    原文链接：http://www.cnblogs.com/webabcd/archive/2011/09/22/2184684.html

    本文题目：HTML5深入浅出教学篇之三
    URL地址：http://www.shufengxianlan.com/qtweb/news47/134147.html

    网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

    广告

    声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

    猜你还喜欢下面的内容

    ChatGPT知识

    同城分类信息

    成都活动策划　　 　成都网站建设　　 　资阳服务器托管　　 　网站设计制作报价　　 　标志设计　　 　免备案虚拟主机空间　　 　成都网站建设公司　　 　重庆网站建设网络公司　　 　成都app开发　　 　ssl数字证书　　 　网站制作报价　　 　成都网站制作　　 　贵州义龙电信机房　　 　成都网站建设公司　　 　wap网站建设　　 　成都网站建设　　 　营销型网站建设　　 　网站建设公司　　 　柔性防护网　　 　移动网站建设