網(wǎng)站在上線前需要進(jìn)行多次重復(fù)的測(cè)試，其中有一個(gè)很重要的步驟就是對(duì)各大瀏覽器的兼容性測(cè)試，每個(gè)客戶使用的瀏覽器是不一樣的，所以需要測(cè)試網(wǎng)站瀏覽器的兼容性，例如那幾個(gè)常用的IE瀏覽器，360瀏覽器，火狐瀏覽器等要兼容。

　　如果一個(gè)網(wǎng)站無法保證這一點(diǎn)，那么不論是搜索引擎還是客戶都不會(huì)對(duì)這個(gè)網(wǎng)站友好的。因此務(wù)必要在建網(wǎng)站的時(shí)候做好網(wǎng)頁兼容性測(cè)試，確保網(wǎng)站可以運(yùn)行順利。下面天水網(wǎng)站制作小編針對(duì)客戶端瀏覽器兼容性問題談?wù)効捶ǎ?/p>

　　網(wǎng)站做好之后一般客戶要求都需要兼容很多瀏覽器，如果網(wǎng)站做出來之后不能夠兼容瀏覽器的話，當(dāng)客戶在用這種瀏覽器進(jìn)行訪問網(wǎng)站的時(shí)候一定會(huì)出現(xiàn)網(wǎng)站打開是變形的情況，如果關(guān)于網(wǎng)站兼容所有瀏覽器也會(huì)是設(shè)計(jì)師一個(gè)比較頭疼的事情。

　　市面上瀏覽器有上百種之多，然而我們?cè)谶M(jìn)行瀏覽器兼容性測(cè)試時(shí)不可以將所有的瀏覽器都測(cè)試一遍，那樣工作量是相當(dāng)大的。我們只需選擇幾款主流的瀏覽器進(jìn)行兼容測(cè)試即可。如IE瀏覽器、火狐瀏覽器、谷歌瀏覽器、蘋果(Apple)Safari、等幾款全球應(yīng)用范圍最廣的瀏覽器進(jìn)行測(cè)試。從理論上講，完美兼容所有瀏覽器所有版本的網(wǎng)頁設(shè)計(jì)，有可能存在，但為了兼容一些不常用的低版本瀏覽器，網(wǎng)頁設(shè)計(jì)師需要付出幾倍的努力去做瀏覽器的兼容調(diào)整工作。

　　常見的幾種網(wǎng)頁元素在瀏覽器中不兼容問題：

　　1、目標(biāo)不居中

　　一般新手都愛出現(xiàn)這個(gè)問題，主要原因是對(duì)盒子模型不夠理解，如果發(fā)現(xiàn)你的頁面沒有居中，基本上有兩種情況：

　　a. 如果是在瀏覽器中沒有居中，就是沒盒子，就是要用一個(gè)大DIV把所有需要居中元素裝起來，然后給盒子一個(gè)css樣式margin:0 auto;

　　b. 如果想要盒子內(nèi)的元素居中，必須定義盒子的絕對(duì)寬度,然后給盒子一個(gè)CSS樣式text-align:center;

　　2、目標(biāo)在不同瀏覽器上的位置不同

　　a. 首先不要去急著找hack,先看一下自己的代碼有沒有錯(cuò)誤，DW里有一個(gè)“檢查瀏覽器兼容性”功能特別實(shí)用;

　　b. 然后，盡量讓目標(biāo)的位置初始化，使之在所有瀏覽器都處在同一個(gè)位置，這個(gè)條件的前提是，不寫hack，最后再一個(gè)方位一個(gè)方位調(diào)整。

　　3、目標(biāo)與目標(biāo)之間距離在各個(gè)瀏覽器上的區(qū)別

　　a. 給其中一個(gè)目標(biāo)加背景顏色;

　　b. 觀察背景色與另外一個(gè)目標(biāo)的距離，查看是不是這個(gè)目標(biāo)造成的距離問題

　　c. 如果不是上一個(gè)目標(biāo)，那就給另外一個(gè)目標(biāo)也加上背景顏色。

　　d. 這樣很容易判斷出那個(gè)目標(biāo)造成的原因，就針對(duì)那個(gè)目標(biāo)進(jìn)行修改。

　　4、IE6兼容問題最多的一個(gè)，浮動(dòng)問題

　　a. flaot浮動(dòng)造成IE6下面雙倍邊距問題，這個(gè)最常見，也最好處理，解決方法：

　　只需要給這個(gè)DIV加一個(gè)樣式：display:inline;

　　b. 布局的時(shí)候經(jīng)常會(huì)遇到這種情況：發(fā)現(xiàn)有一個(gè)DIV浮動(dòng)了，接下來的一個(gè)DIV本來是要在下面顯示的，結(jié)果跑上面去了，這種情況一般在FF下面會(huì)出現(xiàn)。

　　解決的辦法：清除浮動(dòng)，在設(shè)置過浮動(dòng)的那個(gè)DIV下面加一個(gè)DIV，給個(gè)樣式clear:both;如下

　　5、IE8兼容問題

　　ie8下兼容問題，這個(gè)最好處理，轉(zhuǎn)化成ie7兼容就可以。在頭部加如下一段代碼，然后只要在IE7下兼容了，IE8下面也就兼容了

　　6、 背景兼容問題

　　有的時(shí)候明明給一個(gè)DIV加了背景顏色或背景圖片，但是卻顯示不出來或者顯示不全。

　　解決辦法：首先，有可能是DIV沒有設(shè)置絕對(duì)高度。如果設(shè)置了寬度和高度還沒有效果，那么給DIV一個(gè)樣式display:block;(通常a:hover加背景的時(shí)候經(jīng)常遇到)。

　　另外，如果高度必須要設(shè)置成自動(dòng)的話，那么就給DIV一個(gè)樣式overflow:hidden;

　　7、 IE7和Firefox兼容問題

　　很多朋友DIV+CSS的時(shí)候，會(huì)出現(xiàn)，在IE的幾個(gè)瀏覽器下都好使，就是FF下有問題。

　　解決方法：height:100px;/*FF下顯示100的高*/ +height:120px;/*IE678下顯示120高*/

　　原理：FF不識(shí)別加過符號(hào)的屬性，而IE識(shí)別。

　　另外，天水網(wǎng)站制作公司小編強(qiáng)烈建議大家去更新自己用的瀏覽器版本，瀏覽器之所以會(huì)不斷推出新版本，肯定是新版本有各種可圈可點(diǎn)的好處和亮點(diǎn)，而且新版本的各種兼容性，拓展功能也更強(qiáng)，為了讓你瀏覽網(wǎng)頁的時(shí)候更舒適，請(qǐng)一定記得更新你的瀏覽器。當(dāng)你瀏覽網(wǎng)頁時(shí)發(fā)生變形，不妨先看看是不是自己的瀏覽器版本太低。