粗體和斜體不適用於Firefox或Chrome

粗體和斜體標記在iPhone和Internet Explorer上正確呈現，但Firefox或Chrome中沒有格式。粗體和斜體不適用於Firefox或Chrome

這裏是.css文件。我還嘗試在復位和樣式中分別添加i { font-style:italic; }。

Color.css: 

body { 
    color: #fff; 
    background-image: url(../img/background-red.png); 
} 

Reset.css: 

/* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0 | 20110126 
    License: none (public domain) 
*/ 

html, body, div, span, applet, 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, 
input, textarea, button 
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%; 
    font: inherit; 
    vertical-align: baseline; 
} 

/* HTML5 display-role reset for older browsers */ 
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { 
    display: block; 
} 
body { 
    line-height: 1; 
} 
ol, ul, dl { 
    list-style: none; 
} 
blockquote, q { 
    quotes: none; 
} 
blockquote:before, blockquote:after, 
q:before, q:after { 
    content: ''; 
    content: none; 
} 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
} 


Style.css: 

html, body { 
    height: 100%; 
} 

body { 
    margin: 0; 
    overflow: hidden; 

    font: normal 18px/1.4 'Open Sans', Arial, Helvetica, sans-serif; 

    background-position: left top; 
    background-repeat: no-repeat; 
} 

.panel { 
    position: absolute; 
    z-index: 0; 
    background: #fff; 

    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; 
    filter: alpha(opacity=0); 
    opacity: 0; 

    -moz-box-shadow: 0 0 10px #fff; 
    -webkit-box-shadow: 0 0 10px #fff; 
    box-shadow: 0 0 10px #fff; 
} 


.content { 
    max-width: 45%; 
    margin: 100px; 

    float: left; 

    position: relative; 
    z-index: 1;  
} 

h1 { 
    font-size: 72px; 
    line-height: 56px; 
    font-weight: 300;  
} 

h2 { 
    margin: 15px 0 50px;  

    font-size: 30px; 
    line-height: 30px;  
    font-weight: 300;  
}

這裏是HTML，我嘗試使用asdf，看它是否會加粗文字，但它沒有。

<div class="content"> 
    <h1>adssda</h1> 
    <h2>dasdasdsa</h2> 

<p><i><strong>sadsad</strong>asdsad</i></p><br> 
sadasddsa<br><br> 
<strong>asdasd</strong><br><br> 
    <p><strong>asdasd</strong></p><br> 
</div>

爲什麼大膽的文字看起來同普通的文本？

來源

2013-03-19 userrandomnums

您的主重置塊（重置標題下的第一個塊）中的font: inherit正在導致頁面上的所有字體被重置。確實，not even fixing the invalid html to be valid fixes this，你的CSS在腦海中。

評論此房產fixes your text。

來源

2013-03-19 04:33:02 Daedalus

有一個右括號，在發帖時意外錯過了。我刪除了字體：繼承部分，但不幸的是，即使修復了強大的HTML問題，它仍然是一樣的。 – userrandomnums 2013-03-19 05:12:14

@userrandomnums如果您的網站在線..你能鏈接到它嗎？這將使調試更容易，因爲它應該像上一個演示中所示的那樣工作。 – Daedalus 2013-03-19 05:18:43

嘿，我認爲它確實有效。我的朋友說她看到格式化，所以我猜它一定是我的緩存。謝謝你的幫助！ – userrandomnums 2013-03-19 05:29:19

現在更換成這個代碼

<p><strong><i>sadsad</strong>asdsad</i></p><br> 
sadasddsa<br><br> 
<strong>asdasd</strong><br><br> 
    <p><strong>asdasd</strong></p><br>

這個

<p><strong><i>sadsad</i></strong><i>asdsad</i></p><br> 
sadasddsa<br><br> 
<strong>asdasd</strong><br><br> 
    <p><strong>asdasd</strong></p><br>

LIve Demo

來源

2013-03-19 04:17:58

這是因爲你的HTML格式不正確。

您要關閉前

應該

<div class="content"> 
    <h1>adssda</h1> 
    <h2>dasdasdsa</h2> 
    <p><i><strong>sadsad</strong>asdsad</i></p> 
    <br> 
    sadasddsa 
    <br> 
    <br> 
    <strong>asdasd</strong> 
    <br> 
    <br> 
    <p><strong>asdasd</strong></p> 
    <br> 
</div>

來源

2013-03-19 04:19:15

我認爲它的標籤關閉錯誤，在HTML

<p><strong><i>sadsad</strong>asdsad</i></p><br>

這應該是這樣的

<p><i><strong>sadsad</strong>asdsad</i></p><br />

開放式標籤必須在同一個標籤內關閉才能避免錯誤。

來源

2013-03-19 04:20:09 MarmiK

HTML元素是樹狀結構。您的元素在打開時未關閉。的示例 -

<div> 
<p> 
<i> 
<strong> sadsad 
</strong> 
</i> 
</p> 
</div>

來源

2013-08-14 10:15:59 FraZer

Firefox已經與像，和標籤由於某種原因，某些標籤的麻煩。這是Firefox瀏覽器本身的錯誤。嘗試不同版本的Firefox，事情會有所不同。

這裏是適合所有人的解決方法，添加到您的CSS文件：

strong, b { 
    font-weight: bold; 
}

這是一個CSS覆蓋。現在firefox呈現粗體文字像這樣而不是這樣。

來源

2013-11-28 07:43:46

粗體和斜體不適用於Firefox或Chrome

回答

相關問題