不同瀏覽器中的字體和行間距

是否有任何合理的方式來控制所有瀏覽器的字體間距，使得文本將按預期排列，缺乏絕對定位？從一個項目採取以下示例我正在：不同瀏覽器中的字體和行間距

alt text

首先是火狐3.5，第二個是IE 8，第三個是IE 6被示出被包含內的絕對的形式定位div，並使用ol/li元素進行佈局。我在每個列表元素上都有一個5px的底部邊距來提供間距，但除此之外，所有內容都以內聯方式呈現。我意識到每個瀏覽器都會呈現不同的字體，這就是間距蠕變的原因，但當試圖在固定區域內放置東西時，它可能會變得相當新奇（這種特殊形式給了我很大的鼓勵）一個模態對話框）。

來源

2009-12-02 Chris

另一個選項是爲每個父元素添加一個高度聲明。如此一來，只要您選取三者中最高者並將其設定爲默認高度，則所包含文字的高度就無關緊要。

來源

2009-12-03 00:04:18

執行一個reset CSS樣式表，然後自己明確設置所有您的樣式。

這將消除不同瀏覽器應用稍微不同的默認值的趨勢。例如，一個瀏覽器將在項目符號列表項上使用填充，另一個將使用頁邊空白。（我忘了哪一個是做什麼的，這就是爲什麼我總是使用重置的原因）如果你首先重置所有東西，那麼你可以自己決定字體大小，行高，邊距等等，並且讓它們一致地出來在各種瀏覽器中。

一個很好的開始是雅虎的reset.csshere或嘗試另一個here。谷歌搜索「重置CSS」將引導您就這種方法進行大量的討論，優點和缺點。

祝你好運！

來源

2009-12-03 02:22:29 Funka

包括這樣的事情你的主CSS文件的頂部，或者將其包含在它自己的CSS文件：

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, 
pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, 
li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, 
td { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-weight: inherit; 
    font-style: inherit; 
    font-size: 100%; 
    font-family: inherit; 
    vertical-align: baseline; 
}

這將清除所有基於瀏覽器的風格，讓你的CSS樣式出現相同在所有瀏覽器中。

來源

2009-12-03 02:37:39

是否有人在乎寫爲什麼有兩個downvotes？ – 2013-06-12 05:34:55

作爲回答這個問題的人，我也有點困惑:) – 2013-06-14 01:06:16

這一定是因爲人們害怕他們不明白的東西。它的相當不可讀。我會盡力修復它。 – 2013-08-21 20:37:43

不同瀏覽器中的字體和行間距

回答

相關問題