css font的简写规则

CSS的命名规则是用英文字母数字和下划线(一般用小写)来命名,简写css font的好处有三:一是写起来方便(就像键盘快捷键);二是简化代码;三是帮助你熟悉和深刻理解css。

一、字体属性主要包括下面几个

font-family,font-style,font-variant,font-weight,font-size,font

font-family(字体族): “Arial”、“Times New Roman”、“宋体”、“黑体”等;

font-style(字体样式): normal(正常)、italic(斜体)或oblique(倾斜);

font-variant (字体变化): normal(正常)或small-caps(小体大写字母);

font-weight (字体浓淡): 是normal(正常)或bold(加粗)。有些浏览器甚至支持采用100到900之间的数字(以百为单位);

font-size(字体大小): 可通过多种不同单位(比如像素或百分比等)来设置, 如:12px,12pt,120%,1em;

如果用 font 属性的话,就可以把几个样式进行简化;font 属性的值应按以下次序书写(各个属性之间用空格隔开):

顺序:font-style | font-variant | font-weight | font-size | line-height | font-family

二、font的简写实例

.font{
    font-style:italic;
    font-variant:small-caps;
    font-weight:bold;
    font-size:12px;
    line-height:1.5em;
    font-family:arial,verdana;
}

    上面的样式简写为:

.font{
    font:italic small-caps bold 12px/1.5em arial,verdana;
}

 三、font的简写注意事项

1、简写时,font-size和line-height只能通过斜杠/组成一个值,不能分开写。

2、顺序不能改变.这种简写方法只有在同时指定font-size和font-family属性时才起作用。而且,如果你没有设定font-weight, font-style, 以及 font-varient ,他们会使用缺省值


原文链接:HelloWeb前端网 » css font的简写规则 » 感谢您的浏览,希望能有所帮助。

欢迎您加入“Helloweb” 学习交流群:HelloWeb-学习交流群 196291215 共同交流并结识同行,在这里说出您的收获与感想或有什么不同的观点,我们期待您的留言,分享,让我们一起进步!

喜欢 ()or分享