亂七八糟的CSS字體樣式的文檔類型？

我猜我需要一個文檔類型，因爲下面的字體樣式只出現在Safari和Chrome中我想要它。所以我每次添加HTML5文檔類型時，都會寫入自定義字體消失。我是一個業餘編碼器，所以請裸露代碼，我教了自己。亂七八糟的CSS字體樣式的文檔類型？

<!DOCTYPE HTML> 
<html> 
<head> 
    <meta charset="UTF-8"/> 
    <style type="text/css"> 
    #yolk { 
     background-image: url(Yolk.png); 
     background-repeat: no-repeat; 
     background-position: center top; 
     padding-top:250px; 
    } 
    body { 
     background-color:#000000; 
    } 
    #lol { 
     background-image: url(lol.png); 
     background-repeat: no-repeat; 
     background-position: center top; 
     padding-top: 100px; 
     padding-bottom: 100px; 
    } 

    @font-face { 
     font-family: my_font; 
     src: url('http://myurl.com/lolfont.eot'); 
     src: url('lolfont.eot'), url('lolfont.ttf') format('opentype'); 
    } 
    p { 
     font-family: my_font; 
     color: de0000; 
     text-align: left; 
     font-size: 50px; 
     line-height: 10%; 
     text-indent: 350px; 

    } 
    </style> 
    <title>yolk</title> 
</head> 
<body> 
    <div id="yolk"></div> 
    <center> 
    <embed allowScriptAccess="never" src="http://swing.awardspace.com/newcoun… width=320 height=110 wmode=transparent menu=false></embed> 
    </center> 
    <p>test</p> 
    <a href="http://www.google.com" title="lol"><div id="lol"></div></a> 
    </font> 
</html>

來源

2012-05-25 George Oowha

「*我想我需要一個文檔類型，因爲下面的字體樣式只出現在Safari和Chrome中我想要的樣子，所以每次添加HTML5文檔類型時，寫入我的自定義字體消失*」 - So ，當你添加doctype時，字體樣式消失。這就是爲什麼你需要一個文檔類型？等等，什麼？ –

-1

首先檢查您的字體是否有正確的網址，例如您包含的這個網址不正確，它不會引用任何字體。

src: url('http://myurl.com/lolfont.eot'); //???

在w3School表示：類型的.ttf（True Type字體）和雜項文件（OpenType字體）。互聯網瀏覽器9+支持的

火狐，Chrome，Safari和Opera支持字體新的@ font-face規則，但它僅支持類型爲.eot（Embedded OpenType）的字體。注意：Internet Explorer 8和更早版本不支持新的@ font-face規則。

所以不應該有使用Safari或Chrome任何問題......

根據w3School @字體面的正確格式爲：

<style type="text/css"> 
@font-face 
{ 
    font-family: myFirstFont; 
    src: url('Sansation_Light.ttf'), 
    url('Sansation_Light.eot'); /* IE9+ */ 
} 

div 
{ 
    font-family:myFirstFont; 
} 
</style>

對於看到哪裏是你問題一個更好的主意是從一個簡單的代碼開始（類似w3School example）然後將其與您的代碼集成...

並順便說一句，如果您在示例中檢查DOCTYPE如下：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 然而，當你將其更改爲<!DOCTYPE HTML>它仍然有效...

來源

2012-05-25 22:13:21

謝謝，但我試過你的建議，它仍然劑量工作。 –

是的，我試過了，不工作 –

-1關於[W3Schools]（http://www.w3schools.com/）與[W3C]（http://www.w3.org/）的鏈接。這是嚴重誤導，因爲W3School與W3C無關。由於信息不準確，W3School也存在爭議。請參閱[W3Fools.com]（http://www.w3fools.com/）。 – Palec

也有一些是錯誤在你的CSS代碼，它可以是沒有用#開始的顏色。我有類似的問題，因爲我寫了font-size: 12;而不是font-size: 12px;。

順便說一句，我認爲這

url('lolfont.ttf') format('opentype');

應該是相當

url('lolfont.ttf') format('truetype');

來源

2013-12-10 20:12:59 Fanky

始終validate your HTML第一。當試圖用無效標記做任何事時，你只會浪費你和其他人的時間。那麼，你可以validate your CSS。

所犯下的錯誤，我發現：當你正在使用XML serialization，這是區分大小寫的

<!DOCTYPE HTML>應該<!DOCTYPE html>。 <!DOCTYPE之後緊跟的是文檔根元素的名稱。另請參閱SO上的Uppercase or lowercase doctype?。
color: de0000;應該是color: #de0000;。
body元素必須關閉。在</html>之前放置</body>。
刪除</font>標籤 - 不存在開標籤。另外font element is obsolete。
用div代替center element具有style="text-align: center"。它已經過時了。
修復<embed allowScriptAccess="never" src="http://swing.awardspace.com/newcoun… width=320 height=110 wmode=transparent menu=false></embed>。 HTML5的XML序列化中的所有屬性都必須在其值附近引號。 src屬性的內容顯然被截斷，最後的報價缺失。

來源

2013-12-10 21:38:33 Palec

亂七八糟的CSS字體樣式的文檔類型？

回答

相關問題