字體大小顯示了不同的標題

相同

<h1>The Repository For Your Photos.</h1> 
<h2>The Repository For Your Photos.</h2> 
<h3>The Repository For Your Photos.</h3> 
<h4>The Repository For Your Photos.</h4>

CSS復位：

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, 
time, mark, audio, video { 
    margin: 0; 
    padding: 0; 
    border: 0; 
    font-size: 100%; 
    vertical-align: baseline; 
    font-family: "Myriad Set Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; 
}

結果：https://jsfiddle.net/h8wcL2cr/2/

爲什麼他們都一樣嗎？

來源

2016-03-15 Robert Rocha

因爲'font-size：100％' – Hatchet

它們是相同的，因爲你所有的'100％'都是相對於由jsfiddle設置的14px的正文字體大小 –

由於您使用的是CSS重置樣式表，並在你font-size:100%應用於從h1到h6所有標題，這將在font-size重置瀏覽器默認

所以，你必須重新設置爲標題樣式

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
 
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, 
 
time, mark, audio, video { 
 
    margin: 0; 
 
    padding: 0; 
 
    border: 0; 
 
    font-size: 100%; 
 
    vertical-align: baseline; 
 
    font-family: "Myriad Set Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; 
 
} 
 
h1 {font-size:150%} 
 
h2 {font-size:80%} 
 
h3 {font-size:65%} 
 
h4 {font-size:45%}

<h1>The Repository For Your Photos.</h1> 
 
<h2>The Repository For Your Photos.</h2> 
 
<h3>The Repository For Your Photos.</h3> 
 
<h4>The Repository For Your Photos.</h4>

來源

2016-03-15 22:59:28 dippas

好的。所以基本上瀏覽器的默認字體大小是14px，重置會導致所有標題爲14px？ –

我的意思是默認字體大小爲16px –

是應用'font-size：100％'將字體大小重置爲瀏覽器的默認值 – dippas

，因爲你已經選擇了所有的標題標籤和Ga對所有這些人來說都是如此。這就是爲什麼它爲不同的標題顯示相同的字體大小。

來源

2016-03-15 23:00:39

字體大小顯示了不同的標題

回答

相關問題