一鲜屏、需要兼容那些瀏覽器
根據(jù)用戶群體決定兼容哪些瀏覽器：
（1）面向普通用戶
IE8+，Chrome,Firefox
(2)企業(yè)級(jí)產(chǎn)品
IE9+朱巨，Chrome,Firefox
如何了解瀏覽器市場(chǎng)份額：
百度統(tǒng)計(jì)：http://#baidu.com/data/browser/
二择诈、瀏覽器兼容方案
1、css層疊原理
div {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
如上面代碼所示降传，同一個(gè)屬性，后面書寫的值會(huì)覆蓋前面書寫的值勾怒，并且對(duì)于瀏覽器無效的屬性值會(huì)被忽略婆排。
2、條件注釋
針對(duì)IE6笔链，IE7段只，IE8，IE9的條件注釋鉴扫，見如下代碼：
<!--[if lt IE 7]><html class='ie6'><![endif]-->
<!--[if IE 7]><html class='ie7'><![endif]-->
<!--[if IE 8]><html class='ie8'><![endif]-->
<!--[if IE 9]><html class='ie9'><![endif]-->
<!--[if (gt IE 9) | !(IE)]><!-->
<html class='W3C'>
<!--<![endif]-->
效果：
（1）chrome下：
Paste_Image.png
（2）IE下（如IE8）：
Paste_Image.png
這樣就可以針對(duì)不同的瀏覽器做兼容性處理了赞枕，如：
1 .ie8 .selector{
2 /*樣式*/
3 }
3、CSS hack
具體示例見如下代碼：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<title>CSS Hack</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.tip {
/*chrome顯示blue*/
background: blue;
/*IE8 顯示red \9對(duì)IE8-6有效*/
background: red\9;
/*IE7 顯示black *前綴對(duì)IE7幔妨、IE6有效*/
*background: black;
/*IE6 顯示orange _前綴對(duì)IE6有效*/
_background: orange;
}
</style>
</head>
<body>
<div class="tip">
123
</div>
</body>
</html>
