<!DOCTYPE html>
<html>
<head>
<!-- HTML5中浏览器兼容(较低版本的IE浏览器不支持H5的布局):需要在<head>中加入
<!-[if lt IE9]><script src="html5.js"></script><![endif]->(html5.js是外部引入文件),
在head中的<style></style>中加入section、article、header、footer、aside等标签的样式属性,
如section {width:660px;margin:0 auto}。注意:如果加兼容性的判断的话,需要加完整的html、head、body等标签。-->
<!-[if lt IE9]>
<script src="html5.js"></script>
<![endif]->
<meta charset="utf-8" />
<title>布局示范</title>

<style>
section {width:660px;margin:0 auto}
article {width:500px;float:left}
header {width:100%;background:#ddd;text-align:center}
footer {width:100%;background:#ddd}
aside {width:150px;float:right}
</style>
</head>
<body>
这是HTML5!!!<br />
<section>这是h5</section>
<section>这是h5</section>
<section>这是h5</section>
<section>这是h5</section>

<footer>这是脚</footer>
<footer>这是脚</footer>
<footer>这是脚</footer>
<footer>这是脚</footer>
</body>
</html>

HTML5新增的语义标签和IE版本低的兼容性问题的更多相关文章

  1. HTML5中的语义标签兼容IE8以及更低版本的浏览器

    看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...

  2. Html5新增的语义化标签(部分)

    2014年10月29日,万维网联盟宣布,经过接近8年的艰苦努力,html5的标准规范终于制定完成.这是互联网的一次重大变革,这也许是一个时代的来临! 总结一些h5新增的语义化标签,记录下来方便自己学习 ...

  3. html5新增及删除标签

    一.新增标签 有一种划分为,功能性标签[html5新增,如canvas,旧浏览器没有]和语义性标签[如header等只是增强语义,没有新功能].下面按照分几个小类来说. 1.结构标签 新增的结构标签, ...

  4. html5新增的语义化标签极其作用

    在html5中,新增了几个语义化标签:<article>.<section>.<aside>.<hgroup>. <header>,< ...

  5. 让低版本IE支持Html5的新语义标签

    HTML5能为我们做的事儿很多,最为可口的就是语义化标签的应用,如果你已经在Chrome或者其他支持HTML5的浏览器上用过它的牛x,那这篇文章对你一定有用,因为现在你也可以在IE上用到HTML5. ...

  6. 如何让老式浏览器支持html5新增的语义元素

    html5新增加了一些语义元素,如header, footer, nav, aritcle, aside,等等. 然而,有些老款浏览器无法识别这些元素,会把它们当成 inline 元素对待,这会导致一 ...

  7. HTML5新增的音频标签、视频标签

    我们所说的H5就是我们所说的HTML5中新增的语言标准 一.音频标签 在HTML5当中有一个叫做audio的标签,可以直接引入一段音频资源放到我们的网页当中 格式: <audio autopla ...

  8. HTML5新增元素、标签总结

    总是遇到h5新标签的笔试题目,就查阅了资料来总结一下: 1.form相关: (1)form属性:在HTML5中表单元素可放在表单之外,通过给该元素添加form属性来指向目标表单(form属性值设为目标 ...

  9. HTML5新增元素,标签总结

    总是遇到h5新标签的笔试题目,就查阅了资料来总结一下: 1.form相关: (1)form属性:在HTML5中表单元素可放在表单之外,通过给该元素添加form属性来指向目标表单(form属性值设为目标 ...

随机推荐

  1. 以前积攒的一个用Java程序生成验证码的代码

    一个Java类: package com.abc.ufo.util; import java.awt.Color; import java.awt.Font; import java.awt.Grap ...

  2. 说说Linux文件权限那些事儿

    文件全部权 显示文件的全部权 更改文件的全部权 文件的权限 改动文件的权限 用符号表示法改动 用数字表示法改动 使用umask指定默认的文件权限 參考文献 首先我们要知道Linux的标准文件权限和安全 ...

  3. 倍福TwinCAT(贝福Beckhoff)常见问题(FAQ)-人机界面如何设置页面跳转

    TC3中,可以点击某个按钮,改变所显示的视图,然后从你写好的页面中选择一个要跳过去的页面   当然,在跳过去的页面上再做一个按钮可以跳回主页面也是必须的     更多教学视频和资料下载,欢迎关注以下信 ...

  4. Django——如何处理请求(URL配置和视图)

    URLconfig—— 为了绑定视图函数和URL,我们使用URLconf. URLconf 就像是 Django 所支撑网站的目录. 它的本质是 URL 模式以及要为该 URL 模式调用的视图函数之间 ...

  5. 微信小程序flex容器属性详解

    flex容器属性详解 flex-direction决定元素的排列方向 flex-wrap决定元素如何换行 flex-flow 是 flex-direction 和flex-wrap的简写 justif ...

  6. 1364:Field 'sex' doesn't have a default value [ SQL语句 ]

    1364:Field 'sex' doesn't have a default value [ SQL语句 ]   错误解决方法: 关闭MySQL的strict mode的具体做法: 找到MySQL目 ...

  7. silverlight计时器

    引用using System.Windows.Threading; DispatcherTimer dispatchertimer = new DispatcherTimer();//创建一个新的计时 ...

  8. 【MyBatis学习09】高级映射之一对多查询

    上一篇博文总结了一下一对一的映射,本文主要总结一下一对多的映射,从上一篇文章中的映射关系图中可知,订单项和订单明细是一对多的关系,所以本文主要来查询订单表,然后关联订单明细表,这样就有一对多的问题出来 ...

  9. css3 animation steps制作饿了么loading

    html代码 <!DOCTYPE html> <html> <head> <title></title> </head> < ...

  10. 如何高效利用github提升自己

    作为开源代码库以及版本控制系统,Github拥有超过900万开发者用户,是开发者打开程序开源大门的一扇窗口,也是开发者快速提升自己的一个重要途径.本文将从两个方面介绍github的使用方式. 和逛微博 ...