在了解相容問題之前，先了解下瀏覽器的核心。瀏覽器最重要或者說核心的部分是「rendering engine」，可翻譯為「渲染引擎」，不過我們一般習慣將之稱為「瀏覽器核心」。作用是負責對網頁語法的解析並渲染（顯示）網頁。不同的瀏覽器核心對網頁編寫語法的解析不一樣，因此同一網頁在不同的核心的瀏覽器裡的渲染（顯示）效果也可能不同，這也是網頁開發人員需要在不同核心的瀏覽器中測試網頁顯示效果的原因。常見的瀏覽器核心有:trident (ie核心) 、gecko(firefox核心) 、presto(opera前核心,已廢棄,opera現已改用google chrome的blink核心) 、webkit(safari核心,chrome核心原型,開源) 、blink(blink是乙個由google和opera software開發的瀏覽器排版引擎)。
簡單來說，瀏覽器相容的問題的出現，是以下原因造成的：1、由於瀏覽器是各個廠家開發的，所用核心（以上已經講過）與核心架構和**不同。2、出於對自身的利益的考慮，而設定的種種技術壁壘。
比如，同一段**在不同的瀏覽器中有不同的解析，會造成頁面顯示效果不統一。在大多數情況下，我們的需求是，無論使用者用什麼瀏覽器來檢視我們的**或者登陸我們的系統，都應該是統一的顯示效果。
所以瀏覽器的相容性問題是前端開發人員經常會碰到和必須要解決的問題。當然瀏覽器相容不僅僅指的是css樣式的解析不一樣，還有很多js相容問題，今天只說css相容問題。但幸運的一點兒是，隨著技術發展，瀏覽器標準的慢慢統一，相容問題會越來越少，這一點兒對於開發人員來可以說是福音。
問題1：不同瀏覽器的標籤預設的外補丁和內補丁不同。比如，隨便寫幾個標籤，不加樣式控制的情況下，各自的margin 和padding差異較大。
解決方法：在css裡開始使用*萬用字元直接清除padding和margin的值為0;
問題2：預設有間距。比如，幾個img標籤放在一起的時候，有些瀏覽器會有預設的間距。還有容器沒有設定高度的情況下，會預設把底部撐大幾畫素。
解決方法:直接使用浮動屬性。或使用vertical-align:top;
問題3：透明屬性在ie瀏覽器下不相容。
解決方法：
ie瀏覽器寫法：filter:alpha(opacity=value);取值範圍 1-100);
相容其他瀏覽器寫法：opacity:0.value;(value的取值範圍
0-1 0.1,0.2,0.3-----0.9---1)
問題4：在ie瀏覽器上有藍色的邊框，條件是加在a標籤裡時產生。
解決方法: img
問題5：表單元素距離頂部間距不一致。
解決方法:給表單元素新增宣告：float:left;
問題6：在ie6及以下版本中在解析百分比時，會按四捨五入方式計算從而導致50%加50%大於100%的情況。
解決方法: 給右面的浮動元素新增宣告：clear:right;
HTML5前端技術分享 快速上手yeoman
yeoman是google和其他團隊聯合開發的乙個腳手架工具.他的主旨是利用bower,gulp或者grunt迅速搭建乙個易用的工作流，再說白點 就是為我們的專案搭建框架目錄結構，使用它我們還能很快捷的建立專案中的依賴關係。yeoman的logo 是乙個帶帽子的鐵皮人 因為yeoman的使用依賴於n...
HTML 教程 HTML5 標準
您可以使用 html 來建立自己的 web 站點。在本教程中，您將學習如何使用 html 來建立站點。html 很容易學習！相信您能很快學會它！本教程包含了數百個 html 例項。注意 對於中文網頁需要使用 宣告編碼，否則會出現亂碼。doctype html html head meta chars...
HTML 教程 HTML5 標準
超文字標記語言 英語 hypertext markup language，簡稱 html 是一種用於建立網頁的標準標記語言。您可以使用 html 來建立自己的 web 站點，html 執行在瀏覽器上，由瀏覽器來解析。在本教程中，您將學習如何使用 html 來建立站點。html 很容易學習！相信您能很...