CSS字体样式设置
1.字体样式设置
字体样式大致有如下几种特征:
字体类型(风格)、字体粗细、字体大小、字体系列
(1)字体类型(风格) font-style
用于设置字体风格,可设置以下值:
① normal:普通字体
② italic:斜体
③ oblique:倾斜字体
(2)字体粗细 font-weight
用于设置字体粗细,可设置以下值:
① normal:正常粗细
② bold:粗体
③ bolder:更粗的字体
④ lighter:更细的字体
⑤ 100~900:步长为100,
(3)字体大小 font-size
用于设置字体大小的,可设置任意正整数和浮点数
默认情况下,几乎所有的浏览器的默认字体大小都为16px. 且Chrome等主流浏览器不支持12像素以下的字体。
(4)字体系列 font-family
用于设置字体系列,就是我们通常说的“所用字体”。
设置字体有以下规则:
1.使用中文字体,或带空格的英文字体名,需要用“引号”将该字体名扩起来
2.单个单词的字体名称则无需加上引号。
3.“font-family”可以有多个值,多个值设置的作用是,当浏览用户本地计算机没有找到设置的第一个值所表示的字体时,会去找第二个,以此类推,若找到最后一个值都没有找到匹配的字体,浏览器则会用自己的默认字体。
4.考虑到网页最终显示效果在不同设备上的一致性,我们通常使用的中文字体只有:“宋体”、“微软雅黑”、“黑体”、“楷体”、“幼圆”等,而目前以“微软雅黑”为最常用设计字体。
5.常用的英文字体有:“Arial”、“Helvetica”、“Tahoma”、“Verdana”、“Lucida Grande”、“Times New Roman”、“Georgia”等。
2.组合值写法
(1)给上所有的属性
我们能将“font”的多个值组合起来写,比如我们要设置一个
风格为正常,粗体,20像素大小,“微软雅黑”
和
风格为斜体,正常粗细,字号为22像素,“宋体”
1.所以在写“font”属性组合值的时候可以省略二者之一,以辨识到的值进行设置,另外一个自动为“normal”,
2.甚至还能省略掉第前两个值,只保留“font-size”和“font-family”
即:style,weight可只给上任意一个,或者都给,或者都不给,顺序也可以换,但是要在前两个。
注意:
在“font”组合值的写法中,只有“font-size”和“font-family”这两个的值是不能省略的,而且是缺一不可,顺序也是要先大小后系列不能变,否则浏览器会不认识该值,对该组合值进行报错。
(3)在font内设置文本行高
“font”属性组合值的写法,除了以上所提到的,它还有一种比较不常见,却还比较实用的写法,即可直接在“font”属性内设置文本的行高“line-height”
CSS基础之字体样式设置
最新推荐文章于 2024-09-26 13:10:57 发布