html标签及css兼容问题

一、XP下用的IE6/7，IE6/7不支持：
1、html5元素，可以用js去document.creatElement() 创建自定义标签（默认创建的自定义标签为内联），根据需求可以在css里设置该标签display属性
在这种非标准浏览器下兼容h5标签可以使用一个html5shiv.js去实现js创建所有的html5标签
2、IE6、7下，如果浮动的块元素内部含有没有设置宽高的块元素，请给内部块也加上浮动，不然内部块会撑满整行。
3、IE6下，子元素超过父级宽高，会把父级宽高撑开。 （标准浏览器下会看到父级没有包住子级）
4、双倍margin的情况：当元素设置了margin左，然后进行左float的时候，margin值会翻倍。 解决办法：*display:inline;
5、如果li的子元素都浮动的话，li上下两行标签会有4px的缝隙。办法：给li都加上一个 *vertical-align:top;
6、两个浮动元素（一个向左一个向右浮动）中间有注释或者内联元素，并且向右浮动元素和父级宽度相差不超过3px，则会出现多出重复文字的bug。办法：避免触发bug条件 （miaov兼容性第六课）
7、当子级宽高大于父级时，子级又进行了定位relative，父级的overflow:hidden是包不住子级的。办法：给父级也加*position:relative
8、IE6下，当父级有定位，并且父级高宽是奇数时，子元素的绝对定位会有定位值+1px的偏差效果。
9、IE6下，input框内会出现1px的空隙，空隙能显示背景颜色。办法：给input一个*float:left
10、IE6下，输入类型表单控件背景会随着输入字符scroll。办法：*background-attachment:fixed;
11、IE6下，PNG-24 图片不会有透明效果，IE6只支持png-8图片的透明效果。
如何区别是PN8还是PNG24 ：在ps里看图像—模式，png8当然只有8位/通道了。 或者当打开png8的图片时，ps会默认给它的图片标题上加上“索引”两字，png24的则没有。
办法：DD_belatedPNG_0.0.8a.js库（此库除了不能修正body的png24设置，其他的都能）
body的解决办法：标黄部分改成你要的body的背景图就可以了
_background:none;或者根据需求设置为_background-image:none;
_filter : progid:DXImageTransform.Microsoft.AlphaImageLoader(src="img/png.png", sizingMethod="crop");

二、p h1-6  td 千万别嵌套块元素标签，遵守嵌套规则。不然浏览器会自动生成一些标签出来，问题很严重。

三、margin兼容性：margin-top传递、margin上下合并 解决方法看css margin的介绍那里

后续会再跟大家分享下一节的html及css兼容：）