一天搞定CSS：文本text--05

原创于 2017-05-06 16:59:28 发布 · 593 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #文本 #text

前端基础HTML5/CSS3 专栏收录该内容

46 篇文章

订阅专栏

本文详细介绍了一段HTML5代码中如何使用CSS设置文本样式，包括颜色、对齐方式、修饰效果等，通过实例展示了如何综合运用这些属性来美化页面布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.文本体系

这里写图片描述

2.文本各属性取值

说明：

每一个属性后面的分支是属性值，以及对属性值的说明。
比如text-align- - - -有3个取值：left，center，right

这里写图片描述

3.空格大小

这里写图片描述

4.代码演示

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <!--
            文本

            color               颜色
            text-algin          文本的对齐方式
            text-indent         首行缩进（em缩进字符）
            text-decoration     文本修饰
            letter-spacing      字母的间距
            word-spacing            单词的间距（以空格来解析）
            white-space         强制不换行
        -->
        <style type="text/css">
            div{
                width: 1000px;
                border: 1px solid blue;
                font: bold 30px/50px "微软雅黑";

                /*text--set*/
                color: red;
                text-align: center;
                text-decoration: line-through;
                letter-spacing: 5px;
                text-indent: 2em;
                white-space: nowrap;
            }
        </style>
    </head>
    <body>
        <div id="">
            我在学习H5教程，我会成为前端大神的！
        </div>
    </body>
</html>