CSS入门（CSS常用属性----字体、对齐方式、display属性、浮动）

最新推荐文章于 2022-11-18 17:24:29 发布

Brittany____

最新推荐文章于 2022-11-18 17:24:29 发布

阅读量337

点赞数

分类专栏：前端文章标签： css 前端 html

本文链接：https://blog.csdn.net/Brittany____/article/details/127790587

版权

CSS常用属性设置

3.字体

设置字体

font-family
①当font-family的属性值包含空格或特殊字符时，需要将font-family的属性值用引号括起来。
②font-family有“后备”机制，可以为元素设置多种字体，当浏览器不识别第一种字体时，会尝试找下一种字体。
③当font-family的属性值有多个时，使用逗号隔开。

font-family: 楷体;
font-family: "agency fb",楷体1,宋体;

font-size

 /* 设置字体大小 */
font-size: 30px;

font-style
① normol：正常体；
② italic：斜体；
③ oblique：斜体（字体没有斜体时强制倾斜）

/* 设置字体风格 */
 font-style: italic;

font-weight
① bold：粗体；
② 100~900：值越大，字体越粗（400正常字体，700粗体）

/* 设置字体粗细 */
font-weight: 700;
font-weight: bold;

在这里插入图片描述

代码块

<!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>字体</title>
    <style>
        div {
     
        /* 设置字体 */
        font-family: 楷体;
        /* font-family: "agency fb"; */

        /* 设置字体大小 */
        font-size: 30px;

        /* 设置字体风格 */
        font-style: italic;

        /* 设置字体粗细 */
        font-weight: 700;
        }
        p {
     
            font-family: "agency fb",楷体1,宋体;
            font-size: 20px;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <div>国破山河在，城春草木深。</div>
    <p>感时花溅泪，恨别鸟惊心。</p>
</body>
</html