CSS 字体

本文深入讲解了CSS中字体属性的使用方法,包括font-family、font-weight、font-size、font-style和font-variant等,探讨了如何设置字体系列、字体加粗、字体大小和字体风格,以及如何使用系统字体。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

设置字体系列  font-family  用于设置字体的系列。

Regularly,在指定的字体系列后,加上一个通用的字体系列。这样,在指定字体查找不到时,会采用通用字体。

通用的字体系列有:Serif  Sans-serif  Monospace  Cursive  Fantasy

body{font-family: Arial, sans-serif}

如果字体名称存在空格或者特殊符号,该字体需要用单引号。

字体加粗  font-weight

font-weight 的值为100 200 300 400 500 600 700 800 900

normal值是500。比500小的是变细,比500大的是加粗。

font-weight存在继承,子元素是相对父元素加粗或变细多少。

字体大小  font-size

绝对大小:关键字 和 值加绝对长度单位 两种方式

关键字:xx-smaller x-smaller small medium large x-large xx-large

p{font-size: x-small}
p{font-size: 36pt}

相对大小:关键字 和 百分数 两种方式

关键字:larger smaller

p{font-size: larger}
p em{font-size: 120%}

字体风格  font-style

字体风格的值:italic (斜体) normal  oblique inhert

字体变形  font-variant

关键字:small-caps(将大写字母的字体大小变得与小写字母相同) normal inherit

font属性

font 是涵盖所有其他字体属性的简写属性

font的前三个属性是 font-style, font-weight, font-variant,这三个属性没有顺序要求,如果其中某个的属性的值是normal,可以忽略。

font的后两个属性是font-size,font-family ,这两个值由顺序要求,并且必须有值。否则整个font失效。

下面的写法是等价的。

h1{font:normal normal bold 150px sans-serif }
h1{font: bold 15px sans-serif} 

使用系统字体

关键字:

caption:按钮等小控件       menu:菜单,下拉菜单,列表       icon:图标                         

message-box:对话框        small-caption 小控件                    status-bar:窗口状态

 button{font:caption;font-size: 1em}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值