CSS 字体样式
在 CSS 设计中，能够借助font-style属性对文本进行斜体显示的设置。
字体样式拥有丰富地取值，涵盖了normal、italic、oblique以及oblique [角度]等。
这些取值各自对应着不同的文本显示效果，具体如下：
- font-style: normal;
正常显示文本（默认值） - font-style: italic;
使用字体的斜体版本 - font-style: oblique;
将正常文本倾斜（模拟斜体） - font-style: oblique 10deg;
可以指定倾斜角度
使用场景
下面为你介绍font-style属性各类取值，在不同设计场景中的应用：
.normal-text {
font-style: normal;
}
.italic-text {
font-style: italic;
}
.oblique-text {
font-style: oblique;
}CSS 字体粗细
在 CSS 设计中，能够借助font-weight属性对文本进行字体粗细的设置。
字体粗细拥有丰富地取值范围，涵盖了normal(400)、bold(700)、bolder、lighter、或 100 - 900 的数值等。
这些取值各自对应着不同的文本显示效果，具体如下：
- normal(400)
- bold(700)
- 100
- 900
使用场景
下面为你介绍font-weight属性各类取值，在不同设计场景中的应用：
.weight-100 {
font-weight: 100;
}
.weight-400 {
font-weight: 400; /*font-weight: normal;*/
}
.oblique-700 {
font-weight: 700; /*font-weight: bold;*/
}CSS 字体大小
在 CSS 设计中，能够借助font-size属性对文本进行字体大小的设置。
字体大小拥有多元化的设置方式，可用像素（如 12px）精准控制，百分比（如 150%）依父元素自适应，em 基于父元素、rem 基于根元素，vw 和 vh 依视口适配不同屏幕。
这些取值各自对应着不同的文本显示效果，具体如下：
- 像素（16px）
- 百分比（110%）
- 基于父元素（1.1em）
- 基于根元素（1.1rem）
使用场景
下面为你介绍font-size属性各类取值，在不同设计场景中的应用：
p.px {
font-size: 17px; /* 像素值 */
}
p.em {
font-size: 1.1em; /* 基于父元素 */
}
span.rem {
font-size: 1.1rem; /* 基于根元素 */
}
body {
font-size: 15px; /* 像素值 */
}
评论区 0
发表评论
教程介绍
CSS 层叠样式表（Cascading Style Sheets），一种用于为 HTML 或 XML 添加样式的语言。
36
章节
88
阅读
0
评论
反馈提交成功
感谢您的反馈，我们将尽快处理您的反馈