css font简写

旧城等待， 2022-05-27 10:57 225阅读 0赞

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

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（字体大小）: 可通过多种不同单位（比如像素或百分比等）来设置, 如：12xp，12pt，120%，1em

如果用 font 属性的话，就可以把几个样式进行简化，减少书的情况；font 属性的值应按以下次序书写(各个属性之间用空格隔开)：

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

二、font的简写实例

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

上面的样式简写为：

.box\{  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 ，他们会使用缺省值

发表评论取消回复

表情：

评论列表（有 0 条评论，225人围观）

还没有评论，来说两句吧...

相关阅读

相关 CSS 的简写属性

工作中常会看到有人这样写CSS background-color: 000; background-image: url(images/bg.gif);

骑猪看日落/ 2023年05月29日 02:22/ 0 赞/ 3 阅读

相关 CSS字体属性(font-family、font-size、font-weight、font-style)

CSS字体属性 CSS Fonts（字体）属性用于定义字体系列、大小、粗细和文字样式。字体系列 CSS使用font-family属性定义文本的字体系列。

心已赠人/ 2022年12月16日 13:24/ 0 赞/ 209 阅读

相关 CSS 简写边框属性

CSS 简写边框属性 ![在这里插入图片描述][20210325184112732.gif] ![在这里插入图片描述][watermark_type_ZmFuZ3poZ

阳光穿透心脏的1/2处/ 2022年11月13日 04:28/ 0 赞/ 190 阅读

相关 CSS 背景简写

CSS 背景简写 ![在这里插入图片描述][2021032517501599.gif] ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5

深碍√TFBOYSˉ_/ 2022年11月13日 04:26/ 0 赞/ 163 阅读

相关 CSS常用简写样式

1：文本 1)：文字简写 // 倾斜粗细字号/行高字体 font: italic bold 1em/1.5 'Courier New

忘是亡心i/ 2022年10月31日 10:55/ 0 赞/ 190 阅读

相关 css font的简写规则

一、字体属性主要包括下面几个 font-family，font-style，font-variant，font-weight，font-size，font f

梦里梦外;/ 2022年07月18日 00:24/ 0 赞/ 204 阅读

相关 css font简写

一、字体属性主要包括下面几个 font-family，font-style，font-variant，font-weight，font-size，font font

旧城等待，/ 2022年05月27日 10:57/ 0 赞/ 226 阅读

相关【CSS】 fonts （字体）

所有CSS字体属性 font 在一个声明中设置所有的字体属性 font-family 指定文本的字体系列 font

刺骨的言语ヽ痛彻心扉/ 2022年04月11日 04:50/ 0 赞/ 290 阅读

相关 css font-weight原理

为什么要记录一下？因为今天我要设置一个字符加粗，然后就用font-weight:200,没有任何效果。现在看来很可笑，400才相当于normal，200怎么加粗，奇怪的是也没有

落日映苍穹つ/ 2022年01月26日 03:31/ 0 赞/ 281 阅读

相关 css 属性简写

字体: font:权重风格大小/行高字体 font:bolder italic 45px/1.5em '黑体'; 行高和大小是通过'/'写在

迷南。/ 2021年07月24日 15:58/ 0 赞/ 380 阅读