<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>    </title>

<script>

document。createElement("header");

document.createElement("article");

document.createElement("aside");

document.createElement("section");

document.createElement("footer");

</script>

<style>

body{margin:0;}

header{height: 100px; background: #9F3; display: block;}

article{padding:10px; background: #CF6; overflow: hidden; zoom:1; position: relative; display: block;}

section{margin-left:210px; background:#F90; height:300px; width: 800px; position: absolute; left: 10px;top: 10px; display: block;}

aside{width:200px; height:300px; background: #F90; height:300px; display: block;}

footer{height:100px; background: #C6C; display: block;}

</style>

</head>

<body>

    <header>页面头部部分</header>

<article>

  <aside>侧边栏</aside>

  <section>内容区域</section>

</article>

<footer>内容部分</footer>

</body>

</html>

兼容ie 6 7 8

html5新增标签及兼容的更多相关文章

  1. 盒子模型，定位技术，负边距，html5 新增标签

    盒子模型 /*[margin 外边距] margin属性最多四个 1.只写一个值,四个方向的margin均为这个值 2.写两个值:上,右两个方向,下默认=上,右 默认=左 3.写三个值:上.右.下三个 ...

  2. html5新增标签/删除标签

    闲聊: 最近小颖工作稍微比较轻松,没事就看看慕课,看了看:HTML5之元素与标签结构,里面简单讲解了下HTML5的一些新特性,小颖之前没写过HTML5的页面,所以就当写笔记将那些新的特性整理出来,也方 ...

  3. 解决ie9以下浏览器对html5新增标签的不识别，并导致CSS不起作用的问题

    https://www.cnblogs.com/yangjie-space/p/4816279.html html5shiv.js和respond.min.js 做页面常用的东西,写这里用的时候省点去 ...

  4. 让旧浏览器支持HTML5新增标签

    首先我们使用JS进行标签创建,为HTML文件创建我们需要的这几个HTML5标签. 接下来,我们需要使用CSS进行这几个HTML5标签的样式控制,这是因为,通过这种方法创建的新标签,默认是行内元素.   ...

  5. html5新增标签兼容性

    很多低版本的浏览器是不识html5新增的标签的,所以为了解决浏览器兼容性问题,主要有两种方法: js可以创建我们自定义的标签,例如,我们可以用js语句 document.createElement(' ...

  6. CSS3主要知识点复习总结+HTML5新增标签

    文件夹: 1.CSS 属性编写顺序 2.CSS3属性(内核前缀) 3.position相对/绝对定位 4.overflow:scroll等的差别 5.display属性应用 6.盒模型计算方法和Bug ...

  7. HTML5新增标签与属性

    目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...

  8. HTML5新增标签及具体用法

    html5自从推广普及以来,迅速被各大浏览器支持.采用html5设计的网页逐渐成为网页设计的时尚.下面就温习下html5的新增标签. HTML 5 中的新特性包括了嵌入音频.视频和图形的功能,客户端数 ...

  9. HTML5新增标签的汇总与详解

    趁着一点闲暇时间,把HTML5的新增标签整理了一下,用了表格的形式展现,分别归纳了各标签的用法及属性分析.这样方便各位以后在运用HTML5标记遇到疑惑时,直接上来对照看下就明了了,希望对大家有帮助哦. ...

随机推荐

  1. NSBundle

    属性: .使用类方法创建一个NSBundler对象 + (NSBundle *)mainBundle; eg:[NSBundle mailBundle]; .使用路径获取一个NSBundle 对象,这 ...

  2. usb驱动开发之大结局

    从usb总线的那个match函数usb_device_match()开始到现在,遇到了设备,遇到了设备驱动,遇到了接口,也遇到了接口驱动,期间还多次遇到usb_device_match(),又多次与它 ...

  3. 监控jvm的一个坑

    监控jvm的一个坑 1,遇到的问题 我按照以往文档,在catalina.sh里追加jvm的监控api,如下 紧接着我启动 tomcat. 未报任何错误. 发现 lsof –i:12000, 12000 ...

  4. flex align-content中的描述的“多根轴线的对齐方式”中的“多根轴线”到底是什么

    flex 有两条轴线,根据flex-flow 设置的来判断的,水平为主轴的话,那么值为row,垂直为主轴的话那么为column: 其中设置align-items 和 align-content都是来设 ...

  5. Enum简单例子DropdownList

    借鉴:http://www.cnblogs.com/suizhikuo/archive/2013/06/07/3125225.html vs2012 mvc4 最终效果: 1.建立mvc4 Inter ...

  6. ORA-04091: table is mutating, trigger/function may not see it

    今天在论坛里发现了一个关于ORA-04091的老帖子,收获良多,特此整理一下 关于ORA-04091: table is mutating, trigger/function may not see ...

  7. Qt——设计颜色编辑器

    Qt中有一些封装好的对话框,比如QMessageBox.QColorDialog等,用途很广,但缺点是样式难以改变,直接拿来用可能与我们自己的系统样式不搭配,显得很难看. 所以我在无聊的时候,就自己写 ...

  8. 微信内嵌html5页面清楚缓存

    给每个js添加一个版本号,每次修改js后改变一下版本号,浏览器即可自动刷新不用手动清理缓存 <script src="<%=path%>/js/boss/kpi/redli ...

  9. C语言与内存模型初探

    #include<stdio.h> #include<string.h> int main(){ long long int a = 2<<30; char str ...

  10. JBPM4.4业务流程管理框架详细解读

    1. 什么是JBPM4.4业务流程管理框架? JBPM,全称是JavaBusiness Process Management(业务流程管理),它是覆盖了业务流程管理.工作流.服务协作等领域的一个开源的 ...