这两天主要学习了两方面的内容：表格表单以及一些在IE6，7下的兼容问题。
表格表单
1、table 表格；
thead 表格头；tbody 表格主体；
tr 表格行；
th 元素定义表头；td 元素定义表格单元（在一行的为并列关系，从上往下包含）
2、表格样式重置
table{border-collapse:collapse;} 单元格间隙合并
th,td{padding:0;}重置单元格默认填充
3、colspan 属性规定单元格跨可横的列数。 rowspan 属性规定单元格可横跨的行数。
<td colspan="2"></td> <td rowspan="2"></td>
4、表单元素form <input type="…… " name="" value="" />
text：文本框 password：密码 radio：单选 checkbox：复选 submit：提交 reset：重置
button：按钮 image：图片 flie：上传 hidden：隐藏
IE6，7下的兼容问题
1、有的H5标签不能识别，例如header、footer等。
解决办法：运用JS定义这些元素名，创建完是内联元素，然后在CSS里让它们以块元素显示display：block；或者直接调用JS插件解决，这是最方便的方法。
2、块元素包含块元素浮动，如果被包含的块元素设置高度，则被包含的块元素会撑满一行，而不是随父元素浮动。
解决办法：被包含的块元素也设置浮动。
3、左右两个块元素，第一个元素左浮动，第二个元素设置margin-left等于第一个元素的width，结果显示并不会紧挨着，会有一条缝隙。
解决办法：如果想紧挨，避免这种写法，可以将margin-left改成float：left。
4、子元素的宽和高度如果大于父元素的话，会导致撑开父元素，严重改变布局。
解决办法：避免子元素宽高大于父元素。
5、display：inline-block不能识别出来。
解决办法：*display：inline；
*zoom：1；（星号代表只有IE6及以下能识别，转化成内联元素，并触发haslayout）
6、设置高度为1px，但是显示出来最小高度为19px。
解决办法：加上overflow：hidden。
7、当同时设置float：left和margin—left时，元素的外边距会乘以2.
解决办法：*display：inline；转化为内联元素
8、li里的元素都浮动会导致每一行的下方产生4px的空隙。
解决办法：在li中设置*vertical—align：top 垂直方向向上对齐。
9、文字溢出问题
<style>
.box {
width: 300px;
border: 1px solid red;
overflow: hidden;
}
.left {
float: left;
}
.right {
float: right;
width: 298px;
}
</style>
</head>
<!--
当浮动元素之间出现内联元素或注释并且宽度与父元素相差3px以内时，会出现多出文字问题
解决方法：避免出现内联元素或是宽度差大于3px
-->
<body>
<div class="box">
<div class="left"></div>
<span></span>
<div class="right">会多出文字的</div>
</div>
</body>10、子元素大于父元素的宽高时，在父元素加了overflow：hidden也包不住含有position：relative的子元素。
解决办法：让父元素也加上*position：relative。
11、当子级元素定位在父元素的右下角时，如果父级元素的宽高为奇数，定位会出现1px的偏差。
解决办法：尽量避免父级元素为奇数宽高。
12、input标签会留有空隙。
解决办法：让input浮动。
13、input中加背景图片打字超出范围，图片会被挤走。
解决办法：把背景图片加上fixed，也就是固定。