瀏覽器的適配
Ⅰ 什麼是瀏覽器的兼容性
瀏覽器的兼容性是指網頁在各種瀏覽器上的顯示效果可能不一致而產生瀏覽器和專網頁間的屬兼容問題。
在網站的設計和製作中，做好瀏覽器兼容，才能夠讓網站在不同的瀏覽器下都正常顯示。而對於瀏覽器軟體的開發和設計，瀏覽器對標準的更好兼容能夠給用戶更好的使用體驗。瀏覽器兼容的重要性：
1、網站做好了瀏覽器兼容，能夠讓網站在不同的瀏覽器下都正常顯示。
2、瀏覽器兼容能夠抓住更多的網站訪客。
3、瀏覽器兼容能夠給客戶更好的體驗。
(1)瀏覽器的適配擴展閱讀：
兼容趨勢
1、瀏覽器大戰後期的Internet Explorer和Netscape Navigator兩大瀏覽器都支持html 4.0和CSS 1，使得許多專用語法失去意義而被廢止。
2、客戶端腳本方面，瀏覽器大戰的產物DOM變成了瀏覽器間操控技術的共同界面；對專有方法已有涵蓋。
3、瀏覽器市場擴大，網站為了宣稱自己的兼容能力，一般都能在Mozilla Firefox、Opera、Safari和傳統陣營的Internet Explorer、Netscape Navigator正常被瀏覽。
4、瀏覽器的兼容能力日益受到需要；瀏覽器亦因應趨勢，使自己的瀏覽器提供更多兼容功能。
Ⅱ 經常遇到的瀏覽器的兼容性有哪些
1，瀏覽器兼容問題一：不同瀏覽器的標簽默認的margin和padding不同
問題症狀：隨便寫幾個標簽，不加樣式控制的情況下，各自的margin 和padding差異較大。
碰到頻率：100%
解決方案：
CSS里加一行
1
*{margin:0；padding:0；}
備註：這個是最常見的也是最易解決的一個瀏覽器兼容性問題，幾乎所有的CSS文件開頭都會用通配符*來設置各個標簽的內外補丁是0。
2，瀏覽器兼容問題二：塊屬性標簽float後，又有橫行的margin情況下，在IE6顯示margin比設置的大
問題症狀：常見症狀是IE6中後面的一塊被頂到下一行
碰到頻率：90%（稍微復雜點的頁面都會碰到，float布局最常見的瀏覽器兼容問題）
解決方案：在float的標簽樣式控制中加入 display:inline；將其轉化為行內屬性
備註：最常用的就是div+CSS布局了，而div就是一個典型的塊屬性標簽，橫向布局的時候通常都是用div float實現的，橫向的間距設置如果用margin實現，這就是一個必然會碰到的兼容性問題。
3，瀏覽器兼容問題三：設置較小高度標簽（一般小於10px），在IE6，IE7，遨遊中高度超出自己設置高度
問題症狀：IE6、7和遨遊里這個標簽的高度不受控制，超出自己設置的高度
碰到頻率：60%
解決方案：給超出高度的標簽設置overflow:hidden；或者設置行高line-height 小於你設置的高度。
備註：這種情況一般出現在設置小圓角背景的標簽里。出現這個問題的原因是IE8之前的瀏覽器都會給標簽一個最小默認的行高的高度。即使你的標簽是空的，這個標簽的高度還是會達到默認的行高。
4，瀏覽器兼容問題四：行內屬性標簽，設置display:block後採用float布局，又有橫行的margin的情況，IE6間距bug
問題症狀：IE6里的間距比超過設置的間距
碰到幾率：20%
解決方案：在display:block；後面加入display:inline；display:table；
備註：行內屬性標簽，為了設置寬高，需要設置display:block；(除了input標簽比較特殊)。在用float布局並有橫向的margin後，在IE6下，它就具有了塊屬性float後的橫向margin的bug。不過因為它本身就是行內屬性標簽，所以再加上display：inline的話，它的高寬就不可設了。
5，瀏覽器兼容問題五：圖片默認有間距
問題症狀：幾個img標簽放在一起的時候，有些瀏覽器會有默認的間距，加了問題一中提到的通配符也不起作用。
碰到幾率：20%
解決方案：使用float屬性為img布局
備註：因為img標簽是行內屬性標簽，所以只要不超出容器寬度，img標簽都會排在一行里，但是部分瀏覽器的img標簽之間會有個間距。去掉這個間距使用float是正道。（我的一個學生使用負margin，雖然能解決，但負margin本身就是容易引起瀏覽器兼容問題的用法，所以我禁止他們使用）
6，瀏覽器兼容問題六：標簽最低高度設置min-height不兼容
問題症狀：因為min-height本身就是一個不兼容的CSS屬性，所以設置min-height時不能很好的被各個瀏覽器兼容
碰到幾率：5%
解決方案：如果要設置一個標簽的最小高度200px，需要進行的設置為：{min-height:200px； height:auto ！important； height:200px； overflow:visible；}
備註：在B/S系統前端開時，有很多情況下有這種需求。當內容小於一個值（如300px）時。容器的高度為300px；當內容高度大於這個值時，容器高度被撐高，而不是出現滾動條。這時候就會面臨這個兼容性問題。
(2)瀏覽器的適配擴展閱讀：
瀏覽器兼容性解決方案：
1，對於一般用戶來說：
應該用ie8兼容模式瀏覽網頁， 而不應該用ie9或ie10渲染模式. 很多用戶安裝ie10後發生很多網頁顯示錯亂， 就是兼容性的原因， 因為ie10默認的渲染模式是ie10. 此時應該將其改為ie7渲染模式。
用ie6/7渲染模式的原因如下:
中國所有網頁肯定都支持ie，支持ie就是支持ie內核的所有瀏覽器. 但並不一定支持chrome， firefox，雙核瀏覽器的高速模式，原因很簡單，網頁開發人員沒有那麼多時間和精力去兼容及測試那麼多瀏覽器，開發人員能讓網頁在ie下正常工作已經不錯了。
2，對於網站開發者來說：
暫沒有統一的能解決這樣的工具，最普遍的解決辦法就是不斷的在各瀏覽器間調試網頁顯示效果，通過對css樣式控制以及通過腳本判斷並賦予不同瀏覽器的解析標准。
如果所要實現的效果可以使用 框架，那麼還有另一個解決辦法是在開發過程中使用當前比較流行的JS，CSS框架框架，如jQuery，YUI等等，因為這些框架無論是底層的還是應用層的一般都已經做好了瀏覽器兼容，所以可以放心使用。
除此之外，CSS提供了很多hack介面可供使用，hack既可以實現跨瀏覽器的兼容，也可以實現同一瀏覽器不同版本的兼容。
Ⅲ 如何讓網頁在瀏覽器自適應屏幕大小
方法：
1、在網頁頭部加上這樣一條meta標簽：<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />
解釋：
width=device-width ：寬度等於設備屏幕的寬度
initial-scale=1.0：表示：初始的縮放比例
minimum-scale=0.5：表示：最小的縮放比例
maximum-scale=2.0：表示：最大的縮放比例
user-scalable=yes：表示：用戶是否可以調整縮放比例
另外：如果想控制字體的大小的話，應該使用相對大小，可以用下面這段代碼，一般不用也可，這里只是說明一種方法。
相對大小的字體
字體也不能使用絕對大小px，而只能使用相對大小em。
body {font: normal 100% Helvetica, Arial, sans-serif;}
上面的代碼指定，字體大小是頁面默認大小的100%，即16像素。
h1 {font-size: 1.5em; }
然後，h1的大小是默認大小的1.5倍，即24像素（24/16=1.5）。
small {font-size: 0.875em;}
small元素的大小是默認大小的0.875倍，即14像素（14/16=0.875）。
2、讓網頁適應不同的瀏覽器
瀏覽器的格局現在是兩分天下，一分是IE，另一分是NetScape，在國內Ie有絕對的佔有率，在這種情況下我們設計的網頁只要兼容它就行了，但NetScape在國外還是有很多人使用，畢竟它是瀏覽器的元老。
雖然沒有辦法做出讓所有瀏覽器都兼容的網站，但只要注意以下幾點，做出來的網頁在各個瀏覽器都中能達到比較好的顯示效果：
a、不要混合使用層和表格排版，如果是父子關系，如層中表格，不在此原則范圍內。
b、內聯式的 CSS 在 Netscape Navigator 中經常會出現問題，使用鏈式或內嵌式。
c、有時需要在空層插入表格或者透明圖片，以保證在 Netscape Navigator 里的效果。
d、對於只有幾個像素寬度或高度的層，改用圖片來實現。
e、避免使用 W3C 組織不推薦的排版屬性，用 CSS 代替。
Ⅳ 怎樣調整瀏覽器兼容
以360瀏覽器為例，
打開360瀏覽器。
默認都是工作在極速模式。在地址欄右側找到如下綠色閃電圖標。
對某個網站設置為兼容模式後，以後再次打開仍然保持在兼容模式狀態。
同樣方式，可以由兼容模式調整為極速模式。
Ⅳ 如何讓網頁在瀏覽器自適應屏幕大小
想要網頁寬度自適應，需要把網頁元素寬度設置為百分比，還要在網頁頭部加上代碼： <meta name="viewport" content="width=device-width,initial-scale=1.0" />。
圖片自適應，且不超過原始大小，需要設置最大寬度，代碼如下： img{ width:100%; max-width:100%;}。
Ⅵ DIV+CSS怎麼適配瀏覽器
DIV+CSS適配瀏覽器,意思就是對於div+css的布局，在各個瀏覽器中的顯示，而且回是正確的顯示，也就是IE，chrom、firefox等等，要滿答足也就是說在各個瀏覽器中不會出現錯位等問題，要實現這些就需要通過hack，或者是說一些瀏覽器的兼容技術來實現，如一個透明度，一般在ie中用的是filter:alpha(opacity=0);這個屬性來設置div或者是塊級元素的透明度，而在firefox中，一般就是直接使用opacity:0,要做到兼容就是在css中2種都寫到，具體看下代碼：
<html>
<head>
#div1{
width:200px;
height:600px;
margin:0 auto;
opacity:0;
filter:alpha(opacity=0); //0 代表的是隱藏，就是透明度最低。
}
</head>
<body>
<div id='div1'>
<p>測試文字。</p>
</div>
</body>
</html>
Ⅶ 電腦瀏覽器兼容性怎麼弄
這樣的情況，打開瀏覽器，在瀏覽器的地址欄後面會有兼容模式選擇，極速模式或是兼容模式，切換一下就可以了