【网页前端】CSS样式表进阶文本样式
👀专栏介绍
【前端网页】 目前主要更新HTML，一起学习一起进步。
👀本期介绍
本期主要介绍CSS样式表进阶文本样式
文章目录
5. 字体样式
1. 文本对齐
text-align ：用于设置文本内容的水平对齐方式，相当于 html 标签属性中的 align
准备代码：
<style>
.d1{
width: 200px;
height: 100px;
background-color: lightblue;
}
</style>
<body>
<div class="d1">今天天气好晴朗</div>
</body>常见属性值：（在以上代码基础上进行修改）
注意：
仅 块级元素 才可以完整展示对齐效果。
行级元素无法完整展示对齐效果（行级可以通过 display:block; 转块级元素后，使用对齐效果）
2. 文本缩进
text-indent：用于某段文本的首行进行缩进。
例如：text-indent: 10px;
在开发中，不建议在首行缩进处使用 px 单位，这样需要美工人员根据字体大小计算需要缩进的像
素，费
时费力。
所以在开发中，建议 使用 em 单位进行缩进 。
例如： text-indent : 2 em ;
总结：
em 会根据当前字体大小 font-size 自动调整。
用以保证 1em 就是 1 个汉字
3. 文本装饰
text-decoration: 文本的装饰效果。（通常用于给超链接修改装饰效果）
常见属性值：
超链接默认是 underline:
通过设置： text-decoration : none ;
总结：文本装饰，通常用于设置超链接去除下划线。
4. 行高
line-height：用于设置元素内，每行之间的间距。（行高越大，行间距越大）
注意：行高的设置单位可以为 px,em，百分比。
小技巧：若元素中仅有一行内容，需要将内容在元素中垂直居中，仅需要 行高=元素高度 即可
5. 字体样式
在网页样式中，我们可以对字体进行样式调节。
调节字体字号、字体类型、字体粗细、字体样式等
注意：
1 、 font-family 可以设置的字体，都是本机存在的字体。
2 、 font-weight 也可以设置数字 100~900 （除非精细化调整，否则不用数字）
400 是 normal ， 700 是 bold 。
腾讯云开发者
