zoukankan      html  css  js  c++  java
  • Html5 中的新语义标签

    1.1

    语义标签对于我们并不陌生,如<p>表示一个段落、<ul>表示一个无序列表<h1> ~ <h6>表示一系列标题等,在此基础上HTML5增加了大量更有意义的语义标签,更有利于搜索引擎或辅助设备来理解HTML页面内容。

    传统的做法,我们通过添加类名,Html页面具有语义化,但是不具有通用性。

    Html5则是通过新增语义标签的形式来解决这个问题,例如<header></header><footer></footer>等,这样就可以使其具有通用性。

    1.2常用的心语义标签

    <nav> 表示导航

    <header> 表示页眉

    <footer> 表示页脚

    <section> 表示区块

    <article> 表示文章 如文章、评论、帖子、博客

    <aside> 表示侧边栏 如文章的侧栏

    <figure> 表示媒介内容分组 

    <mark> 表示标记 

    <progress> 表示进度 

    <time> 表示日期

    ......

    本质上新语义标签与<div><span>没有区别,只是其具有表意性,使用时除了在HTML结构上需要注意外,其它和普通标签的使用无任何差别,可以理解成<div class="nav"> 相当于 <nav>它只不过是一个标签!

    但应尽量避免全局使用headerfooteraside等语义标签。

    1.3兼容问题

    由于HTML5新标签的并没有得到所有浏览器都支持,特别是IE9以下的低版本。在实际开发中我们更多采用的是通过检测IE浏览器的版本来加载第三方的一个JS库来解决兼容问题。

    1 <!--[if lte IE 8]>
    2     <script src="./js/html5shiv.min.js"></script>
    3 <![endif]-->
  • 相关阅读:
    R 读取xls/xlsx文件
    网页免费转换为可编辑的PDF
    Python: NumPy, Pandas学习资料
    鱼油资料
    Activity的四种启动模式和onNewIntent()
    Android Service、IntentService,Service和组件间通信
    Activity生命周期
    Node.js学习起步
    Android 技能图谱学习路线
    Blog
  • 原文地址:https://www.cnblogs.com/lxj-echo/p/5779650.html
Copyright © 2011-2022 走看看