上篇博文介绍了css的固定格式，这次让我们来看看文字的相关属性吧！
css文字相关属性
在我们运用开发工具的同时，了解工具的快捷键会让我们事半功倍，我也会po出css中idea的一些快捷键
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>文字相关属性</title>
<style>
p{
font-style: italic;
font-weight: bold;
font-size: 30px;
font-family:"微软雅黑";
}
</style>
</head>
<body>
<!--
1.规定文字样式的属性
格式：font-style: italic;
取值：
normal:正常的，默认就是正常
italic：倾斜的
快捷键：
fs font-style
fsn font-style: normal;
2.规定文字的粗细的属性
格式：font-weight: bold;
单词取值：
bold：加粗
bolder：比加粗更粗
lighter：细线 ，默认
快捷键：
fw font-weight
fwb font-weight: bold;
fwbr font-weight: bolder;
数字取值：
100-900之间整百数字
3.规定文字大小的属性
格式：font-size: 30px;
单位：px(像素pixel)
注意点：通过font_size设置大小一定要带单位
快捷键
fz font-size
fz30 font-size: 30px;
4.规定文字字体的属性
格式：font-family:"微软雅黑";
注意点：如果取值是中文，需要用双引号或者单引号括起来
快捷键
ff font-family
-->
<p>
我是段落
</p>
</body>
</html>在开发过程中我们可能还会遇到一些问题：
1、字体不存在？
系统会用默认字体
2、不想用默认字体？
给字体设置备选方案
格式：
font-family:”字体1”,”字体2”，…;
3、如果我们想给英文和中文分别单独设置字体？
中文字体可以包含英文
英文字体不包含中文
我们可以利用这个特点，先设置英文字体，在备选方案设置中文字体
ex.
font-family:”Arial”,”宋体”;
在补充一下文字属性的缩写
<style>
p{
font-style: italic;
font-weight: bold;
font-size: 30px;
font-family:"微软雅黑";
}
</style>上面这段代码可以缩写为：
<style>
p{
font:italic bold 30px "微软雅黑";
}
</style>我们可以看到可以把文字的四个属性同时缩写成一行
注意：
1、中间用空格隔开
2、style和weight两者可以互换位置，也可以省略不写
3、size和family两者不能换位置，并且不能省略，而且必须摆放在最后两位
扫一扫
395
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
