3 CSS 学习笔记第三节 字体属性和文本属性

#####CSS 学习笔记第三节/字体属性和文本属性

---

1.字体

下面开始详细的属性介绍, Let's rock and roll

---

font-family这个是设置字体的.例如:设置为宋体,微软雅黑.幼圆等等.

/*属性应该设置几个字体名称作为一种"后备"机制，如果浏览器不支持第一种字体，他将尝试下一种字体。*/
/*如果字体系列的名称超过一个字，它必须用引号，如Font Family："宋体"。多个字体系列是用一个逗号分隔指明：*/
p{font-family:"微软雅黑", "宋体", "华文幼圆";}
复制代码

---

font-style这个属性用来修改文字的样式,比如:正常啦,斜体或者是加粗.

1.p.normal {font-style:normal;}/*正常*/
2.p.italic {font-style:italic;}/*斜体*/
3.p.oblique {font-style:oblique;}/*文字向一边倾斜*/
复制代码

还好还好...

---

font-size这个是用来设置文字的大小的,一般的单位有 px.em 以及百分比 注意: 浏览器中默认的字体大小是16px

/*用固定像素设置字体*/
h1 {font-size:40px;}
h2 {font-size:30px;}
p {font-size:14px;}/*用 em 设置字体*/
/*
为了避免Internet Explorer 中无法调整文本的问题，许多开发者使用 em 单位代替像素。
em的尺寸单位由W3C建议。
1em和当前字体大小相等。在浏览器中默认的文字大小是16px。
因此，1em的默认大小是16px。可以通过下面这个公式将像素转换为em：px/16=em
*/
h1 {font-size:2.5em;} /* 40px/16=2.5em */
h2 {font-size:1.875em;} /* 30px/16=1.875em */
p {font-size:0.875em;} /* 14px/16=0.875em */
复制代码

在 PC 端写页面的时候其实我们还是px 用的较多.

---

font-weight设置字体的粗细

/*normal 就是正常状态不加粗,bold 是加粗.其实也可以用数字来设置*/
p.normal {font-weight:normal;}
p.thick {font-weight:bold;}
p.thicker {font-weight:900;}
复制代码

OK,这个属性就总结到了这里

---

结束语 这一节我们学习了字体的一些相关属性,还是比较简单的..阴吹思婷. OK.鼓掌,撒花

转载于:https://juejin.im/post/5a39da816fb9a04514642e39