css调用外部字体
CSS中可以使用font-face屬性即可實現調用任何外部等特殊字體。
font-face屬性介紹及其實例:
對瀏覽器的支持:
Firefox、Chrome、Safari 以及 Opera 支持 .ttf (True Type Fonts) 和 .otf (OpenType Fonts) 類型的字體。
Internet Explorer 9+ 支持新的 font-face 規則,但是僅支持 .eot 類型的字體 (Embedded OpenType)。
使用您需要的字體。
在新的 font-face 規則中,您必須首先定義字體的名稱(比如 myFirstFont),然后指向該字體文件。
如需為 HTML 元素使用字體,請通過?font-family?屬性來引用字體的名稱 (myFirstFont):
使用粗體字體。
您必須為粗體文本添加另一個包含描述符的 @font-face。
文件 "aa.ttf" 是另一個字體文件,它包含了 Sansation 字體的粗體字符。
只要?font-family?為 "myFirstFont" 的文本需要顯示為粗體,瀏覽器就會使用該字體。
通過這種方式,我們可以為相同的字體設置許多 @font-face 規則。
實際案例:
| 1 | 案例1: |
| 1 2 3 4 5 6 7 8 9 10 11 12 | <style>? @font-face { font-family:?myFirstFont; src:?url('aa.ttf'), ?????url('aa.eot');?/*?IE9+,可以是具體的實際鏈接?*/ } div { font-family:myFirstFont; } </style> |
| 1 | 案例2: |
| 1 2 3 4 5 6 7 | @font-face { font-family:?myFirstFont; src:?url('aa.ttf'), ?????url('aa.eot');?/*?IE9+?*/ font-weight:bold; } |
注意事項:
A、Internet Explorer 8 以及更早的版本不支持新的 ?font-face 規則。
B、代碼中注意負符號,均為英文狀態下。
C、字體文件格式必須添加后綴,且鏈接中必須帶后綴。
?
?
@font-face {
font-family: SketchRockwell; /*這里是說明調用來的字體名字*/
src: url(‘SketchRockwell.ttf’); /*這里是字體文件路徑*/
}
.my_CSS3_class {
font-family: SketchRockwell; /*這里設置某參數的字體值,在這里是“my_CSS3_class”調用了你剛才聲明的字體值"SketchRockwell"*/
font-size: 3.2em; /*這里是字體大小*/
}
轉載于:https://www.cnblogs.com/kttbk/p/7851123.html
總結
- 上一篇: sob攻略超详细攻略_【五一四天旅游攻略
- 下一篇: 静态链接库LIB和动态链接库DLL的区别