CSS样式表基础(二)——CSS字体

3、CSS 字体

CSS字体属性定义文本的字体系列、大小、加粗、风格(如斜体)和变形(如小型大写字母)。

CSS 字体属性:

  • font ————————简写属性。作用是把所有针对字体的属性设置在一个声明中。
  • font-family —————设置字体系列。
  • font-size ——————设置字体的尺寸。
  • font-style ——————设置字体风格。
  • font-weight —————设置字体的粗细。

1) font-family 属性 定义文本的字体系列。

CSS 定义了 5 种通用字体系列:

  1. Serif 字体
  2. Sans-serif 字体
  3. Monospace 字体
  4. Cursive 字体
  5. Fantasy 字体

如果你希望文档使用一种 sans-serif 字体,但是你并不关心是哪一种字体,以下就是一个合适的声明:

body {font-family: sans-serif;}

可以为给定的元素指定一系列的字体,如
font-family: 隶书, 华文行楷;

2) font-style 属性最常用于规定斜体文本。
该属性有三个值:

  1. normal - 文本正常显示
  2. italic - 文本斜体显示
  3. oblique - 文本倾斜显示

斜体(italic)是一种简单的字体风格,对每个字母的结构有一些小改动,来反映变化的外观。与此不同,倾斜(oblique)文本则是正常竖直文本的一个倾斜版本。
通常情况下,italic 和 oblique 文本在 web 浏览器中看上去完全一样。

3) font-weight 属性设置文本的粗细。
使用 bold 关键字可以将文本设置为粗体。
如:font-weight: bold;

4) font-size 属性设置文本的大小。
font-size 值可以是绝对或相对值。
font-size: 36pt;

例:

<html>
<head>
<meta charset = "utf-8">
<title>CSS</title>
<style>
p {
  color: red;
  font-size: 36pt;
  font-family: 隶书, 华文行楷;
  font-style: italic;
  font-weight: bold;
}
</style>
</head>
<body>
<p>网页设计 第三章 CSS样式表基础</p>
</body>
</html>

图片说明

font 简写属性在一个声明中设置所有字体属性。
可以按顺序设置如下属性:
font-style
font-weight
font-size/line-height
font-family
如:font: italic bold 36pt/40pt 黑体

全部评论

相关推荐

05-11 11:48
河南大学 Java
程序员牛肉:我是26届的双非。目前有两段实习经历,大三上去的美团,现在来字节了,做的是国际电商的营销业务。希望我的经历对你有用。 1.好好做你的CSDN,最好是直接转微信公众号。因为这本质上是一个很好的展示自己技术热情的证据。我当时也是烂大街项目(网盘+鱼皮的一个项目)+零实习去面试美团,但是当时我的CSDN阅读量超百万,微信公众号阅读量40万。面试的时候面试官就告诉我说觉得我对技术挺有激情的。可以看看我主页的美团面试面经。 因此花点时间好好做这个知识分享,最好是单拉出来搞一个板块。各大公司都极其看中知识落地的能力。 可以看看我的简历对于博客的描述。这个帖子里面有:https://www.nowcoder.com/discuss/745348200596324352?sourceSSR=users 2.实习经历有一些东西删除了,目前看来你的产出其实很少。有些内容其实很扯淡,最好不要保留。有一些点你可能觉得很牛逼,但是面试官眼里是减分的。 你还能负责数据库表的设计?这个公司得垃圾成啥样子,才能让一个实习生介入数据库表的设计,不要写这种东西。 一个公司的财务审批系统应该是很稳定的吧?为什么你去了才有RBAC权限设计?那这个公司之前是怎么处理权限分离的?这些东西看着都有点扯淡了。 还有就是使用Redis实现轻量级的消息队列?那为什么这一块不使用专业的MQ呢?为什么要使用redis,这些一定要清楚, 就目前看来,其实你的这个实习技术还不错。不要太焦虑。就是有一些内容有点虚了。可以考虑从PR中再投一点产出
投递美团等公司9个岗位
点赞 评论 收藏
分享
炫哥_:哥们项目描述里面vector和mysql之类的都要写吗,直接开头技术栈巴拉巴拉就行了,完全不是技术点啊
点赞 评论 收藏
分享
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务