CSS之字体和层叠样式表引入

html-CSS第一话之字体

DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>CSS字体属性之字体系列title>
head>

<style>
    h2 {
        font-family: 'Microsoft Yahei';
        /*让h2盒子里的文字水平居中对其*/
        text-align: center;
    }
    p {
        font-family: 'Microsoft Yahei';
        text-align: left;
        /*首行缩进多少距离,px是像素，em是缩进的文字多少*/
        text-indent: 2em;
    }
    /*标题需要自己定义大小需要记住加单位px*/
    body {
        font-size: 16px;/*font-size设置文字大小*/
        /*行高 =  上间距 + 文字 + 下间距*/
        /*改变行高实际是改变上边距和下边距*/
        line-height: 26px;
    }
    .bold {
        /*font-weight: bold;表示加粗
            700相当于加粗后面不跟单位，相当于bold的效果
            实际开发中提倡用数字表示加粗或者变细*/
        /*font-weight: bold(加粗) 700 |normal（正常）400| */
        font-weight: 400; /*后面没有单位*/
        font-style: italic; /*italic字体倾斜, normal表示不倾斜一般都是不倾斜*/
    }
    h2 {
        font-size: 58px; /*标题大小需要自己手动去选择*/
        font-weight: 700;
        font-style: normal;
        /*color: pink;  采用英文单词来表示颜色*/
        /*color: #ff0000; 十六进制表示颜色*/
        color: #00ff21;
        /*color:rgb(255,0,255); rgb表示颜色*/
    }
    div { /*设置字体大小,设置粗体,设置斜体*/
        /*font-size: 16px;
        font-weight: 700; 
        font-style: italic; 
        font-family: 'Microsoft YaHei';
        */
        /*font-size,font-family必须要有*/
        /*font: font-style font-weight font-size font-family
            有顺序不能改变，必须要有size 和 family,font符合属性的写法*/
        font: italic 700 20px 'Miscrosoft yahei';
        text-align: right;
        /*装饰文本*/
        /*none 是去掉下划线 undelline 下划线  line-through 删除线  overline 上划线*/
        text-decoration: underline;
        /*首行缩进*/

    }
style>
<body>
    <h2>成功的秘密h2>
    <p>“成功”，从表面上来看只是一个普通的词语，而从某种意义上来讲，“成功”一词便是一个伟大
的东西。每个人都有成功之时，在这成功的背后，有一个秘密……p>
    <p class="bold">小时候，妈妈告诉我说“做什么事都要主动一点，那样，老师p>
    <p>刚进入初中校园，总觉得还是那自由自在的小学p>
    <div>三生三世十里桃花，一心一意搞钱。div>
body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71

html-CSS之样式表引入

DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>CSS第四课内部样式title>
    <link href="CSS-ONE.css" rel="stylesheet"/>
    
    <style>
        /*内部样式表*/
        p {
            font-size: 20px;
        }
    style>
head>

<body>
    
    
    
    
    
    <p style="font-family: 'Microsoft YaHei'">你好我是你爸爸p>

body>
html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

相关阅读:
[RK3568 Android11]AudioTrack音频流数据传输
[ERROR Swap]: running with swap on is not supported. Please disable swap
Systick滴答定时器解析
【HTTPS】
CSS 3D变换 transform3D
1688图片搜索商品接口（以图搜索商品接口）代码对接教程
智能密集型仓储货架自动化立体库｜四向穿梭式货架对于仓库空间面积上有什么要求？
Spring Security 用了那么久，你对它有整体把控吗？
OpenAI宫斗大戏，奥特曼面临的选择
部署zabbix服务

原文地址：https://blog.csdn.net/qq_46655061/article/details/126002179