css 文本设置

常用的应用文本的css样式：

（1）color 设置文字和颜色，如：color:red;

（2）font-size 设置文字的大小，如：font-size:20px;

（3）font-family 设置文字的字体，如：font-family:’微软雅黑’;

（4）font-style 设置字体是否倾斜，如：font-style:’normal’;设置不倾斜，font-style:’italic’;设置文字倾斜

（5）font-weight设置文字是否加粗，如：font-weight:bold;设置加粗 font-weight:normal设置不加粗

（6）line-height 设置文字的行高，设置行高相当于在每行文字的上下同时加间距，如：line-height:24px;

（7）font 同时设置文字的几个属性，写的顺序有兼容问题，建议按照如下顺序写：
　　 font:是否加粗字号/行高字体; 如：font:mormal 12px/36px ‘微软雅黑’;
（8）text-decoration 设置文字的下划线，如：text-decoration:none; 将文字下划线去掉
（9）text-indent 设置文字首行缩进，如：text-indent:40px; 设置文字首行缩进40px
一般一个中文是20px
（10）text-align 设置文字水平对齐方式，如：text-align:center 设置文字水平居中

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>常用文本样式</title>
    <style type="text/css">
        div{
            font-size:20px;  /* 字体大小 */
            color:green;     /* 字体颜色 */
            font-family:'Microsoft YaHei';  /* 字体：微软雅黑 */
            line-height:40px;  /* 字体行高，行高包括：所在行的文字+上下行间距 */
            /*text-decoration:underline;*/
            text-indent:40px;  /* 设置首行缩进，一般一个中文是20px */
        }

        em{
            font-style:normal;    /* 字体不斜体 */
            color:gold;
        }

        span{
            font-size:40px;
            color:red;
        }

        h1{
            font-weight:normal;   /* 字体不加粗 */
        }

        a{
            text-decoration:none;  /* 去掉下划线 如：去掉链接的下划线 */
            text-align:center;

        }

        p{
            text-align:center;  /* 设置文本水平居中 p标签默认的宽度是整体网页的宽度 */
        }

    </style>
</head>
<body>
    <h1>样式演示</h1>

    <div>
        <span>HTML</span>是<em>Hyper Text Mark-up Language</em>（超文本标记语言）的首字母简写，
        超文本是指超链接，标记指的是标签，是一种用来制作网页的语言，这种
        语言由一个个的标签组成，用这种语言制作的文件保存的是一个文本文件，
        文件的扩展名为html或htm，一个html文件就是一个网页，html文件用编辑
        器打开显示的是文本，可以用文本的方式编辑它，如果用浏览器打开，浏览
        器会按照标签描述内容将文件渲染成网页，显示的网页可以从一个网页链接
        跳转到另一个网页。
    </div>

    <br />

    <a href="https://www.baidu.com">百度的链接</a>

    <p>这是一个p标签</p>

</body>
</html>