200字范文,内容丰富有趣,生活中的好帮手!
200字范文 > 零基础CSS入门教程(8)——CSS设置字体

零基础CSS入门教程(8)——CSS设置字体

时间:2018-07-15 13:11:47

相关推荐

零基础CSS入门教程(8)——CSS设置字体

本章目录

1.任务目标2.css设置字体3.代码演示4.小结

1.任务目标

我们前几个小结学习了,css的选择器,和及基本的改变字体颜色。我们这一小结学习一下设置字体的一些功能

2.css设置字体

(1)font-size这个是设置字体大小,浏览器一般默认字体是16px

(2)font-weight 这个是字体加粗和html字体加粗一样效果正常是400或写normal 加粗值是700或写bold

(3)font-style是设置字体倾斜和html字体倾斜一样效果,倾斜写italic,不倾斜写normal

(4)font-family可以设置字体形式 在后面加sans-serif是无衬线字体写这个墓地为了要是电脑没安装字体他就可以随机给你定义一个无衬线字体,还有serif有衬线字体和monosspace等宽字体

3.代码演示

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>div{/* font-size这个是设置字体大小,浏览器一般默认字体是16px */font-size: 20px;/* font-weight 这个是字体加粗和html字体加粗一样效果正常是400或写normal 加粗值是700或写bold*/font-weight: 700;/*font-style是设置字体倾斜和html字体倾斜一样效果,倾斜写italic,不倾斜写normal*/font-style: italic;/*font-family可以设置字体形式 在后面加sans-serif是无衬线字体写这个墓地为了要是电脑没安装字体他就可以随机给你定义一个无衬线字体,还有serif有衬线字体和monosspace等宽字体*/font-family: 宋体,黑体, sans-serif;}</style></head><body><div>你好啊</div></body></html>

效果如下

4.小结

我们本小结学习了如何设置字体,再css里面设置字体很常用的,我们要熟练使用。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。