<!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. 初学C#和MVC的一些心得,弯路,总结,还有教训(1)--语言的选择

    因为惰性,自制力,求知欲等各方面原因....一直没有学新技术,总感觉VB6凑合能用就凑合用.... 于是大概从05年开始,几乎每次新版的vs一发布,我就下载回来,然后安装,然后,,,,就扔那了.... ...

  2. js(jQuery)获取时间的方法及常用时间类

    获取JavaScript 的时间使用内置的Date函数完成 var mydate = new Date();mydate.getYear(); //获取当前年份(2位)mydate.getFullYe ...

  3. Unit Test测试框架中的测试的执行顺序

    [ClassInitialize()] [ClassCleanup()] [TestInitialize()] [TestMethod] [TestCleanup()] 在执行一个或多个[TestMe ...

  4. 【javascript】箭头函数

    ES6标准新增了一种新的函数:Arraw Function(箭头函数). x => x * x 这个函数相当于 function (x){ return x * x; } 题外话:user st ...

  5. 软件工程（FZU2015）赛季得分榜，第四回合

    目录 第一回合 第二回合 第三回合 第四回合 第五回合 第6回合 第7回合 第8回合 第9回合 第10回合 第11回合 积分规则 积分制: 作业为10分制,练习为3分制:alpha30分: 团队项目分 ...

  6. spring-poi-excle往单元格写入图片

    HSSF是POI工程对Excel 97(-2007)文件操作的纯Java实现 XSSF是POI工程对Excel 2007 OOXML (.xlsx)文件操作的纯Java实现 在POI中有HSSFPat ...

  7. PRINCE2第二个原则

    PRINCE2要求项目团队吸取以前的经验教训,在项目生命周期中发现.记录和应对.吸取经验教训,应该记录在整个生命周期中,项目准备期应该回顾以往类似项目,看看是否有经验教训可以应用,如果项目是第一次做, ...

  8. Asynchronous fs.stat.isDirectory()

    function showFile() { for(var i = 0; i< files.length; i++){ var itemFile = files[i]; fs.stat(__di ...

  9. Hibernate JPA实体继承的映射(一) 概述

    http://www.cnblogs.com/yingsong/p/5179975.html   注:文章中据说的实体指的是被@Entity注解的类. JPA中对象关系映射通常情况下是一个实体对应一个 ...

  10. elk系列4之kibana图形化操作

    preface 我们都搭建了ELK系统,且日志也能够正常收集的时候,那么就配置下kibana.我们可以通过kibana配置柱状图,趋势图,统计图,圆饼图等等各类图.下面就拿配置统计图和柱状图为例,结合 ...