CSS:浏览器兼容性调试

CSS HACK

选择符级hack

略

---

属性级hack

简写：
<style>
div{
	background:#f00;
	*background:#0f0; /*ie6，ie7支持*/
	_background:#f00; /*ie6支持*/
}
</style>

详细：了解即可
	_：	选择IE6及以下。
	*：	选择IE7及以下。诸如：（+）与（#）之类的均可使用，不过业界对（*）的认知度更高
	\9：	选择IE6+
	\0：	选择IE8+和Opera
	[;property:value;];：选择webkit核心浏览器（Chrome,Safari）。IE7及以下也能识别。
		中括号内外的3个分号必须保留，第一个分号前可以是任意规则或任意多个规则
		[;color:#f00;]; 与 [color:#f00;color:#f00;]; 与 [margin:0;padding:0;color:#f00;]; 是等价的。
		生效的始终是中括号内的最后一条规则，所以通常选用第一种写法最为简洁。

	.test{
		color:#c30;          /* For Firefox */
		[;color:#ddd;];      /* For webkit(Chrome and Safari) */
		color:#090\0;        /* For Opera */
		color:#00f\9;        /* For IE8+ */
		*color:#f00;         /* For IE7 */
		_color:#ff0;         /* For IE6 */
	}

---

IE条件注释语句（推荐使用）

用于不同版本IE兼容性调试
适用版本：IE6-9
(注：f12切换IE不同版本只在IE10下支持)
if条件共包含6种选择方式：是、非、大于、大于等于、小于、小于等于

示例：

<!--[if IE 6]>
<link rel="stylesheet" href="ie6.css">
<style>div{color:#f00;}</style>
<script src="ie6.js"></script>
<![endif]-->

其他条件：

如果是ie <!--[if IE]>
如果是ie7 <!--[if IE 7]>
如果大于ie7 <!--[if gt IE 7]>
如果大于等于ie7 <!--[if gte IE 7]>
如果小于ie7 <!--[if lt IE 7]>
如果小于等于ie7 <!--[if lte IE 7]>
如果不是ie7 <!--[if ! IE 7]>

---

浏览器分类

国际品牌浏览器
IE：ie6 7 8 9 10 11
chrom
firefox
safari
opera

国产山寨牌浏览器
360：安全版，极速版
搜狗：兼容版，高速版
猎豹：兼容版，高速版
遨游。。。
QQ。。。
taobao。。。
百度。。。

---

浏览器内核

webkit：chrom，opera,safari,山寨牌所有极速版浏览器(应用最广)
Trident：ie浏览器，山寨牌所有兼容版浏览器
Gecko：firefox

---

显示器分辨率和浏览器市场份额

http://tongji.baidu.com/data/browser

---

网页兼容性调试流程

注意：网页必须有头文件，否则容易出现兼容性问题 ，尤其是IE

前提：网页必须在高级浏览器下制作，例如chrome，
开发网页时候，尽量固定页面宽度（960px,980px(推荐),1000px,1200px）
(如果不固定页面宽度（弹性布局），当页面内容复杂时，不同分辨率下布局会错位)
网页制作完成后：

1：chrome下兼容性调试
	不同分辨率下兼容性调试
		1：我电脑分辨率下网页兼容性
		2：比我电脑更小的分辨率下调试
			缩小浏览器宽度高度来模拟低分辨率情况
			如果变形，需要给元素设置固定宽、高、边距等样式
		3：比我电脑更大的分辨率下调试
			缩小你浏览器上的网页近似模拟高分辨率情况
				注意：只是近似模拟，不是相同，
				调试结果仅用于测试网页超大背景颜色和图片，网页居中布局
（缩小页面调试完成后记得回复页面比例：ctrl+0）
	
2：其他浏览器下兼容性调试
	所谓其他浏览器，狭义指的就是 ie6,ie7,
		1：使用chrome制作网页
		2：使用ie查看网页
			先用本系统自带ie查看网页
			再按ie f12，切换ie不同版本查看网页（注意ie7）
			再使用ietester软件，模拟ie6查看网页
		（下面步骤根据需要可做可不做）
		如有必要，本机安装虚拟机（virtualPC），安装xp系统，使用内置ie6调试网页
		如有必要，再使用其他浏览器（国际、山寨）调试网页。

转：http://suoking.com/web/?m=css-jianrongxing