首页 > 其他分享 >css font 属性怎么快捷写?

css font 属性怎么快捷写?

时间:2023-05-17 11:32:35浏览次数:27  
标签:style family weight height 快捷 font css size

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

等效于:

font-style:italic;

font-variant:small-caps;

font-weight:bold;

font-size:12px;

line-height:1.5em;

font-family:arial,verdana;

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

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

不过使用这种简写需要注意几点:要使简写定义有效必须至少提供 font-size 和 font-family 这两个属性 ;同时font-weight, font-style 以及 font-varient 这几个属性如果不做设定的话将默认为normal。

font快捷写法的格式为:

复制代码代码如下:
body {
font: font-style font-variant font-weight font-size line-height font-family;
}

所以,

复制代码代码如下:
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-weight: normal;
font-variant: small-caps;
font-style: italic;
line-height: 150%;
}

可以被写成:

复制代码代码如下:
body {
font: italic small-caps normal 13px/150% Arial, Helvetica, sans-serif;
}

标签:style,family,weight,height,快捷,font,css,size
From: https://blog.51cto.com/u_14682436/6289298

相关文章

  • 使用CSS选择器进行元素定位
          在seleniumwebdriver中,支持使用CSS选择器来进行元素定位,事实在真的投入工作,大量编辑用例和元素定位的时候,使用css和xpath才是经常需要用到的。之前有专门讲过使用xpath对元素定位的使用,下面要介绍css选择器来进行元素定位。【参见W3C官网说明】http://www.w3schoo......
  • css 样式文件中的特殊符号 - 波浪号(也叫 tilde,squiggle,twiddle)
    例子:.check:checked~.content{}~选择器实际上是后继同胞组合器(在2017年之前称为一般同胞组合器):后继同胞组合器由“波浪号”(U+007E,~)字符组成,它将两个简单选择器序列分隔开。由这两个序列表示的元素在文档树中具有相同的父级,并且由第一个序列表示的元素位于由第二个序列表......
  • 电商JD商城登录页面html+css
    这也太难了吧,怎么连抄咱也不会抄啊QAQ看了这么久的前端,总是感觉看得懂,写不出来,抄也不会抄这不,这又抄写了一个京东电商商城的登录页面,本来想好好学习一下页面的布局以及编写结构和思维,结果html代码还行,至少可以看的懂,到了css上就完全不知道怎么设置样式了,感觉有的样式完全可以不......
  • app直播源码,css宽度不固定,水平居中
    app直播源码,css宽度不固定,水平居中1.相对定位:  #box{position:relative;left:50%;float:left;} #inner{position:relative;left:-50%;} ​需考虑浮动带来的问题 2.利用diplay:table来解决: #box{display:table;margin:0auto}/*不支持ie6,ie7*/  3.CSS3fl......
  • CSS 计数器
    CSS计数器通过一个变量来设置,根据规则递增变量。使用计数器自动编号CSS计数器根据规则来递增变量。CSS计数器使用到以下几个属性:counter-reset -创建或者重置计数器counter-increment -递增变量content -插入生成的内容counter() 或 counters() 函数-将计数......
  • css网页布局
    网页布局有很多种方式,一般分为以下几个部分:头部区域、菜单导航区域、内容区域、底部区域。 头部区域头部区域位于整个网页的顶部,一般用于设置网页的标题或者网页的logo:CSS3实例.header{ text-align:center;padding:20px;}https://www.scsmld.com/jjs/......
  • CSS选择器有哪些
    CSS选择器是用来选择HTML或XML元素的一种方式,CSS选择器可以根据元素的标签名、类名、ID、属性值等特征进行选择。以下是一些常用的CSS选择器:标签选择器:使用元素的标签名作为选择器,例如:p、h1、div等。类选择器:选择具有指定类名的元素,使用“.类名”作为选择器,例如:.demo。ID......
  • CSS伪类实现0.5px边框
    div-class为需要添加0.5px边框的元素的类名,下面是less写法,css写法把嵌套的&::after提出来,换成.div-class::after.div-class{position:relative;&::after{position:absolute;bottom:0;content:'';width:100%;height:1px;background-c......
  • 记录--css水滴登录界面
    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助前言今天我们来分享一款非常有趣的登录界面,它使用HTML和CSS制作,具有动态的水波纹效果,让用户在登录时感受到了一股清凉之感。基本html框架<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8">......
  • FreeCodeCamp-通过构建摩天轮学习 CSS 动画
    index.html<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>FerrisWheel</title><linkrel="stylesheet"href="./styles.css"></head&g......