您现在的位置是：首页 > 网站制作 > CSS3|Html5CSS3|Html5
HTML5网页如何让所有的浏览器都能识别语义元素标签样式
胜于蓝2019-11-05【CSS3|Html5】人已围观
简介浏览器对语义元素的支持情况如今HTML5愈来愈引发大家的关注了，但目前支持HTML5的浏览器还不是主流，特别是国内用户近50%以上仍旧使用IE6，由于支持HTML5的IE9不支持Xp系统安装，这
浏览器对语义元素的支持情况
如今HTML5愈来愈引发大家的关注了，但目前支持HTML5的浏览器还不是主流，特别是国内用户近50%以上仍旧使用IE6，由于支持HTML5的IE9不支持Xp系统安装，这样未来很长一段时间，HTML5的开发者将必须考虑向下兼容的问题。HTML5的标签或CSS选择器兼容性的做法有很多，其中自己生成标签元素就是一种。
为了让浏览器能识别html新标签并显示对应样式的效果有几种不同的办法：
一、不认识html5语义元素的浏览器不知道因为怎样把它们显示成块级元素，所以会把它们挤到一起。未解决这个问题，只要在样式表中添加一条超级规则即可。
article,aside,figure,figcaption,footer,header,hgroup,nav,section,
summary {
dispaly:blok;
}
PS：对于大多数浏览器，第一种技术可以解决问题。但这里的大多数并不包括IE8以及更早的版本。换句话说，对于较早版本的IE，还要面临一个挑战：他们会拒绝给无法识别的元素应用样式。好在有一个可以变通方案：通过JavaScript创建新元素，可以骗过IE，让它来识别外来元素，比如，下面的方法
二、脚本可以让IE识别并为<header>元素应用样式：
<script>
document.createElement('header')
</script>
三、实际上，你不用亲自写这些代码，只要在<header>区块中引用它即可，就像这样：
<head>
<title></title>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
...
</head>
PS:html5.js脚本应该是有条件执行的——只在你使用旧版本IE的情况下才会执行。为了避免不必要的加载js文件，可以像下面这样引用脚本代码放在IE的条件注释中
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
这样其他浏览器（IE9以及更高版本）就会忽略这行脚本，为你的页面节省毫秒的加载时间。
四、使用Modernizr，Modernizr会自动替你解决上述问题，不用使用html5.js或者样式规则。
1、打开www.modernizr.com，找到 Download Modernizr 区域，单击其中的Development按钮，下载Modernizr的js文件。
2、把下载到的js文件放到你的网页所在文件夹，例如js文件夹。
3、在页面<head>区块中添加对这个js文件的引用。
示例：
<head>
<meta charset="utf-8">
<title>Html5</title>
<!--[if lt IE 9]>
<script src="/skin/blog/js/modernizr.js"></script>
<![endif]-->
...
</head>
Tags：
扫描关注胜于蓝微信公众号，第一时间获取网站模板更新动态
本文地址：/web/html/1144.html
很赞哦！ ()
相关文章
随机图文
CSS 颜色名称
所有浏览器都支持颜色名称147颜色名称定义在HTML和CSS的颜色规格(17个标准色加上130多个其他)。下表列出了所有这些，连同其十六进制值。提示: 17种标准颜色：浅绿色，黑色，蓝色，紫
CSS3 画基本图形，圆形、椭圆形、三角形
CSS3 圆形 #css3-circle{ width: 150px; height: 150px; border-radius: 50%; background-color: #232323;} CSS3 椭圆形 #css3-elipse{ width: 200px; height: 100px
HTML 颜色
HTML 颜色由红色、绿色、蓝色混合而成。颜色值HTML 颜色由一个十六进制符号来定义，这个符号由红色、绿色和蓝色的值组成（RGB）。每种颜色的最小值是0（十六进制：#00）。最大值是255（十-
布局中 各类常见的兼容性问题
1.双倍浮动Bug 描述：块元素设置 float 后，又设置了横向的margin，在IE6下显示的margin值比设置的值要大； 解决方案：给设置 float 的元素添加 display: inline; 2.表单行高不
文章评论
当前时间
快速排名
- 网站建设|万词霸屏,企业软文推广,刷下拉框
- 快速排名：不用再等SEO三个月，只需3-7天即可把行业关键词覆盖百度搜索引擎首页，点击不收费，排名报表，真实访问量报表一目了然。
合作加盟
- 填写商户姓名不要带有“超市”,“便利店” ,“百货”等
- 扫码成为快钱代理
- 扫码加站长微信,为您推荐快钱总部负责人
- 快钱POSS机（电签版）
- 1,免押版：签约费率快捷交易0.38%,常规交易0.65%
- 贷记卡单笔≥3000元视为激活
- 2,,有押版：签约快捷交易0.38%,常规交易0.65%
- 激活首刷≥99元,扣除99元系统服务费,多出部分shishi到账
- 电签版ipos参与每月扶持奖励
- 电签版ipos与Mpos单独考核台均
- 30台以上有效激活奖励3000元扶持金
- 当月交易额≥3000元的为活跃用户
快钱代理公告
- 凡事扫码代理必须实名认证
- 实名认证后才可拉进代理微信群
- 代理微信群有相关活动政策等
标签云
猜你喜欢
