- 表格布局：
以前表格更多的情况实际上是用来对页面进行布局的，但是这种方式早已被CSS所淘汰了
表格的列数由td最多的那行决定
表格是可以嵌套，可以在td中在放置一个表格
- 完善clearfix
解决父子元素的外边距重叠
.box1:before{
content: "";
display:table可以将一个元素设置为表格显示
display: table;
}
解决父元素高度塌陷
.clearfix:after{
content: "";
display: block;
clear: both;
}
经过修改后的clearfix是一个多功能的样式，既可以解决高度塌陷，又可以确保父元素和子元素的垂直外边距不会重叠
- 框架集
框架集和内联框架的作用类似，都是用于在一个页面中引入其他的外部的页面
框架集可以同时引入多个页面，而内联框架只能引入一个
在h5标准中，推荐使用框架集，而不使用内联框架
使用frameset来创建一个框架集，注意frameset不能和body出现在同一个页面中
所以要使用框架集，页面中就不可以使用body标签
属性：
rows，指定框架集中的所有的框架，一行一行的排列
cols， 指定框架集中的所有的页面，一列一列的排列
这两个属性frameset必须选择一个，并且需要在属性中指定每一部分所占的大小
frameset中也可以再嵌套frameset
frameset和iframe一样，它里边的内容都不会被搜索引擎所检索
所以如果搜索引擎检索到的页面是一个框架页的话，它是不能去判断里边的内容的
使用框架集则意味着页面中不能有自己的内容，只能引入其他的页面
而我们每单独加载一个页面，浏览器都需要重新发送一次请求，引入几个页面就需要发送几次请求，用户的体验比较差
如果非得用建议使用frameset而不使用iframe
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>框架集</title>
</head>
<frameset cols="30%, *, 30%">
<!--
在frameset中使用frame子标签来指定要引入的页面
引入几个页面就写几个frame
-->
<frame src="demo069_表格.html" />
<frame src="demo070_给表格添加样式.html" />
<!-- 嵌套一个frameset -->
<frameset rows="30%, 50%, *">
<frame src="demo072_表格的布局.html" />
<frame src="demo073_完善clearfix.html" />
<frame src="demo074_表单.html" />
</frameset>
</frameset>
</html>
- 图片的修复
在IE6中对图片格式png24支持度不高，如果使用的图片格式是png24，则会导致透明效果无法正常显示
解决方法：
1.可以使用png8来代替png24，即可解决问题，但是使用png8代替png24以后，图片的清晰图会有所下降
2.使用JavaScript来解决该问题，需要向页面中引入一个外部的JavaScript文件，然后在写一下简单的JS代码，来处理该问题
在body标签的最后引入外部的JS文件
再创建一个新的script标签，并且编写一些js代码
< 以下代码只会在IE6中执行，其他浏览器中无效
[if IE 6]
<script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix("div,img");
</script>
<![endif]-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ie6png的修复</title>
<style type="text/css">
.box1{
width: 200px;
height: 200px;
background-image: url(img/3_1.png);
background-repeat: no-repeat;
}
.box2{
width: 200px;
height: 200px;
background-image: url(img/3.png);
background-repeat: no-repeat;
}
</style>
</head>
<body style="background-color: #bfa;">
<div class="box1"></div>
<div class="box2"></div>
<img src="img/3.png" alt="大脸猫">
<!-- 以下代码只会在IE6中执行，其他浏览器中无效 -->
<!--[if IE 6]-->
<script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix("div,img");
</script>
<![endif]-->
</body>
</html>
