一、兼容前缀+兼容写法

兼容前缀

1.HTML5有部分类容兼容到IE9,IE8及以下完全不兼容的内容不再考虑.

2.部分内容需要加兼容前缀

a)     -webkit- 兼容谷歌

b)     -moz- 兼容火狐

c)     -o- 兼容欧朋

d)     -ms- 兼容IE

e)     例子:-webkit-样式属性

3.兼容性查询网站: http://caniuse.com

兼容写法

IE版本:如果小于等于IE 9 就执行if语句里面的代码 ( It小于 lte小于等于)

二、结构性标签(带有语义化)

  1. <header></header>页眉,也可用与块头部
  2. <nav></nav>导航
  3. <section></section>页面上的板块 一个小区有
  4. <article></article>用来在页面中表示一套结构完整且独立的内容部分 页面中某一个完整的部分 <article>标签里面可以放</section>标签
  5. <aside></aside>侧边栏,广告,nav元素组,以及其它类似的内容部分aside的内容应该与artical的内容相关
  6. <footer></footer>页面的底部或者板块的底部

三、语义化标签

1.<hgroup></hgroup>一个标题和一个子标题,或者标语的组合

2. <figure></figure>用于对元素进行组合.一般用于图片或视频

3. <figcaption></figcaption>为元素添加标题

4. <time></time>用来表示时间或日期

5. <datalist></datalist>标签定义选项列表.请与input元素配合使用该元素,来定义input可能的值.请使用input元素的list属性来绑定datalist 的ID.

6. <details></details>用于描述文档或文档某部分的细节.该元素用于摘录引用等,与标签配合使用 默认关闭的 打开需要加open属性

7.<summary></summary>detailst元素的标题

8.<dialog></dialog>定义一段对话,默认是关闭的 展开需要添加open属性

9.<address></address>定义文章或页面作者的详细联系信息 字体是斜体 可以用font-style:normal 改正字体

10.<meter></meter>定义已知范围或数值内的标量测量.也被称为gauge(尺度).

max 最大值属性

min  最小值属性

value 当前值属性

low 下限

high 上限

11.<progress></progress>定义进度条

.

12. <mark></mark>需要标记的词或句子,默认黄色背景.

HTML5--(1)兼容前缀+结构性标签+语义化标签的更多相关文章

  1. HTML5学习之语义化标签(一)

    一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...

  2. HTML5学习之语义化标签

    一.为什么HTML5要引入新语义标签 在HTML5出现之前,我们一般采用DIV+CSS布局我们的页面.但是这样的布局方式不仅使我们的文档结构不够清晰,而且不利于搜索引擎爬虫对我们页面的爬取.为了解决上 ...

  3. HTML html5 语义化标签

    什么是语义化标签 语义化标签就是具有某种含义及结构的标签,让其更容易理解和使用. HTML5 新增了一些语义化标签,如下: article article 标签装载显示一个独立的文章内容.例如一篇完整 ...

  4. 让HTML5语义化标签兼容IE浏览器

    解决方案:IE9以下旧版本浏览器不支持新的语义化标签.其中一种解决方案就是用js将HTML5增加的标签创建出来,就像下面这样.(放在header部位) <script> var html5 ...

  5. HTML5语义化标签

    在HTML5中最基础也是比较好理解的也就是语义化标签了,,顾名思义语义化也就是可以直接读懂的标签~,这样我们在项目开发过程中不但自己不会因为5花8门的标签命名而伤脑筋,跟同事对接项目也会节约很多时间~ ...

  6. 从零开始学 Web 之 HTML5(一)HTML5概述,语义化标签

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  7. HTML5语义化标签总结

    1.语义化标签总结 基础布局标签 <header></header> <nav></nav> <main></main> < ...

  8. HTML5 01. 布局、语义化标签、智能化表单、表单元素/标签/属性/事件、多媒体、类操作、自定义属性

    1.知识点 lang = “en”   所用语言是英文 文档结构更简洁 IE8一下不支持h5c3 书写更宽松 div没有语义 标签语义化:在合适的地方使用合适的标签 对seo优化友谊 网页经典布局 页 ...

  9. html5语义化标签使用规范

    Html5添加了很多语义化标签,一个典型的html5页面结构可以如下安排 一.使用案例 1. 头部——header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍 ...

随机推荐

  1. update sharepoint 2013 cu error

    1. 安装过程合理: A. 可以同时在管理中心.两台前端.搜索服务器上安装重新发布的SP1补丁包(所提供的链接) B. 等待所有SP1补丁包安装完成,依次在管理中心.两台前端.搜索服务器上运行配置向导 ...

  2. 当我们在谈论multidex65535时,我们在谈论什么

    本文来自网易云社区 作者:郑文 首先我们并不在讨论车牌号.本文尽量避免谈论重复的技术点,只探讨一下multidex提供给我们的技术启示. 原理 multidex技术原理可以分成两个部分: 在app启动 ...

  3. ClamAV学习【2】——clamscan入口函数浏览

    就简单给代码加上些注释,方便理解.第一次浏览,应该会有不正确的理解.后面会继续学习修改. 文件:clamscan\clamscan.c 代码如下: nt main(int argc, char **a ...

  4. java学习笔记—第三方数据库连接池包1(29)

    第一步:导入dbcp包 第二步:通过核心类连接数据 BasicDataSource它是javax.sql.DataSrouce的子类. 一个工具类:BasicDataSourceFactory. 手工 ...

  5. “全栈2019”Java多线程第十七章:同步锁详解

    难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java多 ...

  6. [bzoj1951] [Sdoi2010]古代猪文 费马小定理+Lucas定理+CRT

    Description "在那山的那边海的那边有一群小肥猪.他们活泼又聪明,他们调皮又灵敏.他们自由自在生活在那绿色的大草坪,他们善良勇敢相互都关心--" --选自猪王国民歌 很久 ...

  7. objectARX 关于MFC类向导 无法向此非CCmdTarget派生类添加任何命令 的解决方式

    objectARX 关于MFC类向导 无法向此非CCmdTarget派生类添加任何命令  的解决方式 图文By edata ,转载注明出处 http://www.cnblogs.com/edata 1 ...

  8. Django2.0 URL配置详解

    转自:https://www.cnblogs.com/feixuelove1009/p/8399338.html Django2.0发布后,很多人都拥抱变化,加入了2的行列. 但是和1.11相比,2. ...

  9. SpringMvc HttpMessageConverter之@ResponseBody

    我们先看HttpMessageConverter的示意图,从图片可以看出它是多么的重要.在一条必经之路截道了的感觉. 先上我的测试例子: jsp页面: <%@ page language=&qu ...

  10. C语言多线程编程二

    一. 线程通信----事件: 1.一对一模式: #include <stdio.h> #include <stdlib.h> #include <Windows.h> ...