字体属性介绍
CSS中的字体属性是干什么的呢?字体字体确定和字体有关咯,就是设置HTML页面中文本的字体,
CSS中经常使用的字体属性有几种呢,笔者给你们梳理了下,比较经常使用的一共有5种,今天咱们就看看这5种能给文本的字体带来什么效果呢。
CSS 字体属性定义文本的字体系列、大小、加粗、风格(如斜体)。
在CSS中经常使用的字体属性有5种,如:font-style、font-weight、font-size、font-family、font。
font-style设置斜体
font-style属性主要是给文本设置斜体用的。
font-style属性使用表
值
描述
normal
将斜体字体恢复正常。
italic
设置字体为斜体。
让咱们进入font-style属性的实践,实践内容如:将HTML页面中的p标签的文本字体设置为斜体。
假如咱们不使用font-style属性,可不可将p标签中的文本字体设置为斜体呢?,若是你们学习HTML还能够,应该知道在HTML当中有一个i标签,i标签的做用就是将文本的字体设置为斜体,自带的功能。
有点啰嗦了哈,给初学者普及下细节哦。html
代码块性能
设置字体为斜体成功不是战胜别人,而是改变本身。
成功不是战胜别人,而是改变本身。
结果图学习
注意:使用font-style属性能够将i标签自带的斜体功能给去除掉,如:下面关键代码哦。字体
i{
font-style: normal;
}
使用font-style属性设置文本的字体为斜体。
代码块网站
设置字体为斜体p{
font-style: italic;
}
成功不是战胜别人,而是改变本身。
结果图ui
font-weight设置字体粗细
font-weight属性是用来设置文本的字体粗细。
font-weight属性说明表
属性值
描述
normal
将文本的粗细恢复为正常。
bold
字体加粗。
100到900
字体加粗
让咱们进入font-weight属性实践,内容将HTML页面中的p标签文本字体加粗,笔者使用class属性值为.box将第一个p标签文本字体加粗为900,为何用class属性值为.box呢,方便初学者理解,其他的都是同样的,就不过多的说明了。
代码块code
设置字体粗细.box{
font-weight:900;
}
成功不是战胜别人,而是改变本身。
成功不是战胜别人,而是改变本身。
结果图orm
font-size设置字体大小
font-size属性就是设置文本的字体大小,因为font-size属性值比较单一,就不用font-size属性说明表解释了,font-size属性值是px为单位。htm
让咱们进入font-size属性的实践,实践内容如:将HTML页面中的p标签文本字体大小设置为14像素。
代码块blog
设置字体大小p{
font-size: 14px;
}
成功不是战胜别人,而是改变本身。
结果图
font-family 设置字体
font-family属性给文本的字体设置风格,如:微软雅黑、楷体、宋体....
园友都看到这里了,相信你们都有了必定的自学能力了,就很少介绍了,直接上关键的代码了,你们能够本身尝试各类字体哈。
代码块
font-family: "微软雅黑";
注意:font-family属性可使用多个如:font-family: "微软雅黑","宋体",....;
细节:通常很特殊的字体,网站上面都是使用图片来表示。是否能显示此字体是根据用户电脑里面是否对应的字体文件,若是没有该文件就会显示为宋体。
font字体设置的缩写
缩写属性可以同时给文本设置斜体、加粗、大小、字体,每个值之间要使用逗号隔开,而且必定要有顺序。
让咱们进入font字体设置缩写实践,实践内容如:将p标签中文本设置为斜体、加粗、大小、字体。
代码块
字体设置的缩写p{
font: italic 900 14px "微软雅黑";
}
成功不是战胜别人,而是改变本身。
结果图