css实现网页调用服务器端字体@font-face属性
在网页制作和网站开发过程中，网页上使用的字体往往由于浏览者电脑中没有相应的字体，达不到我们设计的效果。为了解决这个问题，我们可以直接使用我们服务器端上的字体。
语法：
<style>
@font-face {
font-family : webfont ;
src : url( 字体名.ttf ) ;
}
p{font-famliy:webfont;}
</style>
还可以设置粗体/斜体文本时，调用的字体。
<style>
//设置正常文本调用的字体
@font-face {
font-family : webfont ;
src : url( 字体名1.ttf ) ;
}
//设置斜体文本调用的字体
@font-face {
font-family : webfont ;
font-style:italic;//斜体
src : url( 字体名2.ttf ) ;
}
h1{font-famliy:webfont;}
h2{font-famliy:webfont;
font-style:italic;
}
</style>
设置调用本地字体
<style>
@font-face {
font-family : '黑体' ;
src : local( '黑体') ;
}
p{font-famliy:'黑体';}
</style>
设置调用字体大小写
font-variant:small-caps
| 值 | 描述 |
|---|---|
| normal | 默认值。浏览器会显示一个标准的字体。 |
| small-caps | 浏览器会显示小型大写字母的字体。 |
| inherit | 规定应该从父元素继承 font-variant 属性的值。 |
设置调用字体粗细
font-weight
值 ：bold:粗；bolder:更粗；lighter:更细；100-900 从细到粗 数值必须是100的倍数 400相当于普通字体
设置调用字体变形
font-stretch 大多浏览器不支持此属性