美文网首页
font的简写规则

font的简写规则

作者: Amfishers | 来源:发表于2016-06-02 10:50 被阅读3673次

在W3C标准中 font将可能出现下面的值:

font-style                :  规定字体样式。
font-variant              :  设置小型大写字母的字体显示文本。
font-weight               :  规定字体粗细。
font-size/line-height     :  规定字体尺寸和行高。
font-family               :  规定字体系列。
caption                   :  定义被标题控件(比如按钮、下拉列表等)使用的字体。
icon                      :  定义被图标标记使用的字体。
menu                      :  定义被下拉列表使用的字体。
message-box               :  定义被对话框使用的字体。
small-caption             :  caption 字体的小型版本。
status-bar                :   定义被窗口状态栏使用的字体。

在这11项中,我们常用的其实就前面的6项,按默认顺序如下:

font-style    :  normal(标准) , italic(斜体) , oblique(倾斜) , inherit(继承父级) ,。
font-variant  :  normal( 默认值。浏览器会显示一个标准的字体),
                  small-caps(浏览器会显示小型大写字母的字体。)。
font-weight   :  normal(正常)或bold(加粗)。有些浏览器甚至支持采用100到900之间的数字(以百为单位);。
font-size     :  可通过多种不同单位(比如像素或百分比等)来设置, 如:12xp,12pt,120%,1em , 1.2rem
line-height   :  规定字体尺寸和行高。
font-family   :  "Arial" , "Microsoft YaHei" 之类  。

简写


如果用 font属性的话,就可以把几个样式进行简化,减少书的情况;
font 属性的值应按上面所列的顺序书写,常用的属性值有上述的6项:
各个属性之间用空格隔开

举个栗子:

.fisher{
font-style:italic;
font-variant:small-caps;
font-weight:700;
font-size:12px;
line-height:24px;
font-family:"Microsoft YaHei";
}

简写如下:

.fisher{ font:italic small-caps 700 12px/24px "Microsoft YaHei"; }

【说明】
1、顺序不能改变;
2、简写为一行的时候,font-size和line-height直接一样要用斜杠,不能分开写;
3、没有赋值的属性,会自动使用默认值;

相关文章

  • font的简写规则

    在W3C标准中 font将可能出现下面的值: 在这11项中,我们常用的其实就前面的6项,按默认顺序如下: 简写 如...

  • 字体相关的属性

    font 1 .以下属性的简写:但是规则一大堆,还是分开写吧2 .font-style:选择font-family...

  • css中font、background、border样式的简写

    font样式简写: font:[font-style] [font-weight] [font-size] / [...

  • css基础

    字体 font-family font-size font-style font 简写 size family t...

  • CSS3中字体和文本的相关设置

    字体:font(简写属性) 1.font-family 2.font-size 3.font-weight(字重:...

  • CSS一些实用的技巧

    css 字体简写规则 当使用css定义字体时你可能会这样做: font-size: 1em; line-heigh...

  • 属性连写

    Font属性连写规则 font:font-style font-variant font-weight font-...

  • background

    区别: font属性对字体综合样式进行简写有顺序:

  • css font属性解析

    css font样式,具体什么意思?代码如: 解释: 这是css中font的简写写法。字体:字体大小/字体行高 字...

  • CSS之(font&background )属性简写

    font 简写属性在一个声明中设置所有字体属性 字体属性主要包括下面几个 font-style(字体样式):nor...

网友评论

      本文标题:font的简写规则

      本文链接:https://www.haomeiwen.com/subject/jpxkdttx.html