v6_css文本属性-CFANZ编程社区

字体大小 font-size：px 浏览器默认16 设计图常用12
字体 font-family：可同时设定多个字体，逗号分隔，直到识别匹配字体
颜色color：3种可表示：颜色英文 16进制写法 rgb(0,0,255)调比例
加粗 font-weight
倾斜font-style
文本水平对齐 text-align：多行文本也适用，center多行全居中显示 justify两端对齐
行高 line-height /*对单行，将文字高度等于行高，文字自行垂直方向上居中对多行，文字高度缩小，等于行距缩小，调整显示在div内*/
首行缩进 text-indent：可用px 缩进两个字符2em [em是相对单位，对此时字体大小乘2]
字间距 letter-spacing：英文用word-spacing 间距可负数
文本修饰 text-decoration：上划线oevrline 下划线underline 删除线line-through 没有划线none
检索大小写，英文字母修饰 text-transform：每个首字母大写capitalize 全部大小写 uppercase / lowercase none
文字简写 font：是font-style font-weight font-size/line-height font-family的简写；font itatic 800 30px/80px "宋体"；顺序不可改变且必须同时指定font-size和family属性时才起作用

**以上属性点，以下例子均有体现
<style>
        .p1{
            font-size: 18px;
            color: slateblue;
        }
        .p2{
            font-family: 宋体;
        }
        h1{
            font-weight: 400;
            font-style: italic;
            text-align: left;
        }
        .box1{
            text-align: center;
            width: 500px;
            background:rosybrown
        }
        .box2{
            text-align: justify;   
            width:500px;
            background: lemonchiffon;
            height: 120px;  
            line-height: 24px;

        }
        .box3{
            width: 500px;
            background: lightgray;
            height: 80px;         /*整个div高度*/
            line-height: 80px;    
            text-align: center;   
            text-decoration: none;  
        }
        .box4{
            width: 450px;
            background: floralwhite;
        }
        #p4{
            letter-spacing: 0px;
            text-indent: 2em;
        }
        #p5{
            text-transform: lowercase;     /*单词首字母都大写*/
            font:italic bold 20px/1em 宋体;  /*斜体 加粗 大小/行高与字同高 字体*/
        }
    </style>
</head>
<body>
    <p class="p1">dfcgvhbj  nkfcgvjhbk-jnfcknjmbwlk,nm. </p>
    <p class="p2">dfcgvhbj  nkfcgvjhbk-jnfcknjmbwlk,nm. </p>
    <p>默认dfcgvhbj  nkfcgvjhbk-jnfcknjmbwlk,nm. </p>
    <h1>世界你好</h1>
    <div class="box1">都好的</div>
    <div class="box2">
        冬残奥会比赛项目知识科普随着北京2022年冬奥会的关注度持续
        升温冬残奥会的脚步也逐渐近了虽然冬残奥会项目较为精简但依然
        精彩纷呈让我们一起来了解一下本次北京冬残奥会的6项运动项目吧~
        比赛场地国家体育馆国家体育馆。
    </div>
    <div class="box3">奥运会</div>
    <div class="box4">
        <p id="p4">
            第13届冬季残疾人奥林匹克运动会即2022年北京冬季残奥会。温冬
            残奥会的脚步也逐渐近了虽然冬残奥会项目较为精简但依然精彩纷呈
            让我们一起来了解一下。
        </p>
        <p id="p5">
            北京冬季残奥会设7大项，81小项。北京将承办所有冰上项目，即残奥
            冰球，残奥冰壶。We are family everyone。
        </p>
    </div>