CSS 字体类型 字体重量 字体风格 字体大小 字体变形
{font-family:‘一个字体’,‘一个通用字体系列’;}
/*前面的字体,如果用户安装了,优先显示,后面的,备用(最后的,最好用通用字体系列,这样更接近原本要用的字体,比如说,衬线.无衬线,手写)。*/
{font-weight:700;}
{font-weight:bold;}
/*因为字体加粗是设计的结果而不是增加宽度而已,字体会有不同数量的,根据它做出的,加粗设计变形字体,
所以字体加粗与现存的某个字体的加粗变形设计等价,字体值被赋值给数字。
默认定义:400==normal,700==bold,
如果一个字体有多个尺寸,如果有medium字体变形的,medium字体变形被赋值500,如果有比bold更粗的字体,赋值800-900。如果有Light,赋值100-300。
如果只有normal和bold,normal会被赋值100-500,bold会被赋值600-900;
而lighter 和bolder ,是相对于它的父元素来说的。到100 和 900 为止。
举例来说,如果一个字体只有normal,medium,bold 3种字体变形,
{font-weight:normal 被赋值100-400;}{font-weight:medium被赋值500}{font-weight:bold被赋值600-900}
如果设置了{font-weight:100}那么,字体的样子就等价于normal{font-weight:400},这时如果子元素设置为{font-weight:bolder} ,实际就是medium{font-weight:500},子元素的内部子元素再设置{font-weight:bolder} 实际就是bold{font-weight:700}
*/
{font-style:inherit;}
/*
4个可选值: normal(默认),italic(斜体字体), inherit(继承),oblique(倾斜文本(只是把文字变斜))
*/
{font-size:medium ;}
{font-size:2017px ;}
{font-size:smaller ;}
{font-size:17% ;} =={font-size:0.17em ;}/*根据从父元素继承的大小算的,字体百分比是继承的,每个子元素都会是从父元素继承的大小*17%,最里面的子元素,就会变得很小 */
/*5种表示方法
值:xx-small | x-small | small(有些用户代理的默认) | medium (默认)| large | x-large | xx-large | smaller | larger | length | percentage |
字体大小相对值,larger 和smaller 和加粗变形不同,不被局限在一个特定的范围内。
缩放值按1.5或者1.2倍(不同用户代理 可能不同)
默认字体大小也取决于,不同用户代理。
*/
{font-variant:inherit;}
/*
3个值:inherit | normal(默认) | small-caps (用大写字母写,但是这些大写字母大小不一,类似于text-transform:uppercase;)
举例:The ,变成:
T
HE
T会变得更大,he会变成稍小的大写字母。
但是有些用户代理会把它变成全部一样的大写字母。
*/
如果直接用 font{:;}表示,
规则一:必须声明 font-size 和 font-family 的值。
规则二:所有值必须按如下顺序声明。
1. font-weight、 font-style、 font-variant 不分先后;
2. 然后是 font-size;
3. 最后是 font-family。 (后面两个必须连着)
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· .NET Core 托管堆内存泄露/CPU异常的常见思路
· PostgreSQL 和 SQL Server 在统计信息维护中的关键差异
· C++代码改造为UTF-8编码问题的总结
· 【.NET】调用本地 Deepseek 模型
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业