在CSS 里面font-family，font-face，這兩個有什么不同？

第一個是指定字體。

創新互聯2013年至今，先為宜春等服務建站，宜春等地企業，進行企業商務咨詢服務。為宜春企業網站制作PC+手機+微官網三網同步一站式服務解決您的所有建站問題。

.youclass{font-family:文鼎POP;}。

此處 font-family 指定字體為 文鼎POP ，但電腦上沒裝 文鼎POP 字體的人看網頁，將看不到這個字體效果，任看到電腦上默認的 宋體 或 微軟雅黑體，因此針對中文操作系統來說：為保證網頁效果，通常只能指定：宋體、黑體、微軟雅黑之類的系統上默認自帶的字體。

第二個 font-face 的用法是載入一個字體。

@font-face { font-family:comic;src:url(文鼎POP.eot); } 。

將文鼎POP 的 .eot 格式文件傳到服務器上，然后用 font-face 加載到網頁中，別人電腦沒裝這個字體，但用 font-face 加載后同樣能在網頁上顯示出文鼎POP的效果。

css特點：

結構與樣式分離的方式,便于后期維護與改版;

樣式定義精確到像素的級別;

可以用多套樣式,使網頁有任意樣式切換的效果(如:的開,關燈效果)；

降低服務器的成本。

什么是@font-face及font-face如何在css中使用

@font-face {

font-family: YourWebFontName;/*自定義的字體名稱，最好是使用下載的默認字體，他將被引用到Web元素中的font-family*/

src: source [format][,source [format]]*;/*自定義的字體的存放路徑*/

[font-weight: weight];

[font-style: style];/*weight定義字體是否為粗體，style主要定義字體樣式，如斜體*/

}

不過瀏覽器對各種字體解析不一致，下載到的字體通常只有.ttf格式。那么要兼容各主流瀏覽器就得通過在線字體轉換網站轉換得到這幾種字體【.eot,.woff,.ttf,.svg】

那么具體用法：

html：

h2 class="Demo"Demo/h2

先自定義好字體

@font-face {

font-family: 'NeuesBauenDemo';

src: url('../fonts/neues_bauen_demo-webfont.eot');

src: url('../fonts/neues_bauen_demo-webfont.eot?#iefix') format('embedded-opentype'),

url('../fonts/neues_bauen_demo-webfont.woff') format('woff'),

url('../fonts/neues_bauen_demo-webfont.ttf') format('truetype'),

url('../fonts/neues_bauen_demo-webfont.svg#NeuesBauenDemo') format('svg');

font-weight: normal;

font-style: normal;

}

最后引用：

h2.Demo {

font-family: 'NeuesBauenDemo'/*通過這個引用下載的字體格式*/

}

css中使用@font-face聲明圖標文字為什么顯示出來邊框

你的代碼寫錯了，這應該是：!important。注意一下細節，在css中這個如果是正確的他應該顯示為紅色，在dw中是這樣，我不知道你這個是用的什么，所以不是很清楚，但是一般的關鍵字都是不會和普通的代碼的顏色一樣。

關于CSS中@font-face 嵌入字體的用法

關于@font-face的介紹（來自w3c）

網頁中的eot字體文件

用@font-face來加載服務器上的字體后，是需要用font-family來作用到指定的類、ID、標簽上才可以的。

比如對h1定義test這個字體，那么要用font-family來聲明使用這個test才可以。

@font-face用的不是太多，一個中文字體集的字體都有好幾M，不像英文字體那樣比較小，所以如果需要做特殊的藝術字或者要的效果還是做成圖片來的簡單、高效。

什么是@font-face，以及在css當中如何使用

@ font-face的是一個CSS規則，允許你輸入自己的字體出現在網站上，即使在特定的字體在訪問者的計算機上沒有安裝。這條規則最重要的是，它為設計師打開了一個全新的世界。您可以使用任何你喜歡的字體。

下面的語法是你如何使用@ font-face的。首先，定義新的字體所提供的名稱和說明的字體。

@font-face?{

font-family:?DeliciousRoman;

src:?url('');

}

然后你引用它。

p?{

font-family:?DeliciousRoman,?Helvetica,?Arial,?sans-serif;

}

就是這樣。

在前面的例子中使用外部來源。但是，如果將字體文件是在您的服務器上，那么你可以參考以下的方式：

@font-face?{

font-family:?DeliciousRoman;

src:?url('…/Delicious-Roman.otf');

}

此外，還有其他三個字體屬性，您應該知道的。首先是font-stretch，您可以設定的字體會被拉伸，“normal’”是默認的。此外，有字體的風格，讓你的字體是斜或斜體。最后，還有字體的重量，最后字體為粗體，等你可以自己設置

@font-face?{

font-family:?DeliciousRoman;

src:?url('…/Delicious-Roman.otf');

font-stretch:?condensed;

font-style:?oblique;

font-weight:?bold;

}

建議：

字體渲染是一件棘手的事情 - 尤其是老移動瀏覽器。你應該總是測試，你可以盡可能多的設備支持。發現問題的速度越快越好。

最后，請記住，使用許多不同的字體可能會減慢你的網站需要時間來加載所有這些字體！

望采納！

本文題目：css樣式face,css樣式方框屬性
文章轉載：http://vcdvsql.cn/article20/dsdjdjo.html

成都網站建設公司_創新互聯，為您提供定制網站、網站導航、小程序開發、網站策劃、用戶體驗、網站設計

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯