css文本样式

文本样式

    /* p.second的意思是：选择类名是second的p标签 */
    p.second {
        /* 设置文本首行缩进 */
        /* em:是指当前字体的大小
         2em==2*18px==36px */
        /* text-indent: 2em;
        text-indent: 36px; */
        /* 设置字与字之间的间距 */
        /* letter-spacing: 10px; */
        /* 设置单词与单词之间的间距 */
        word-spacing: 20px;
        /* 设置文本的对齐方式 
        可选值：
         left 左对齐，默认
         right 右对齐
        center  居中对齐
        justify 二端对齐*/
        text-align: justify;

    }

    a {
        /* 设置文本修饰：是否下、上、中划线
        text-decoration
           可选值：
              none：取消文本修饰
              line-through:删除线
              underline:下划线
              overline:上划线*/
        text-decoration: none;
        /* text-decoration: line-through; */
        /* text-decoration: overline; */

    }

    a:hover {
        text-decoration: underline;
    }

    div.div1 {
        /* 设置背景颜色 */
        background-color: antiquewhite;
        width: 150px;
        height: 25px;
        /* overflow:设置溢出内容的显示
            hidden：溢出内容隐藏
            auto:按需求生成滚动条
            scroll:生成滚动条 
        overflow-x:设置水平方向的溢出
        overflow-y:设置垂直方向的溢出*/
        /* overflow: scroll; */
        /* overflow-x: hidden; */
        overflow: hidden;
        /* 设置文本溢出的显示样式
          text-overflow
           可选值：
                ellipsis ：省略号
                clip 剪切
                  */
        text-overflow: clip;
        /* text-overflow: ellipsis; */
        white-space: nowrap;
        /* 文本单行省略：
         设置元素的宽高=》内容溢出是隐藏（overflow）=》
         设置文字默认一行显示（white-space）=》文本溢出的样式text-overflow */
        /* 多行省略？今天的作业 */

    }

    h2 {
        /* 设置文字阴影
               text-shadow：x y blur color
                 x=>在水平方向的偏移量，正值向右
                 y=>在垂直方向的偏移量，正值向下
                 blur=>设置阴影的模糊范围
                  */
        text-shadow: 2px 2px 2px red;
    }

    ul>li {
        /* 设置边框：1像素粉色实线 */
        border: 1px solid pink;
        height: 40px;
        /* line-height:设置文本行高
        单行文本垂直居中：line-height==height */
        /* 设置文本水平垂直居中 */
        line-height: 40px;
        text-align: center;
    }

    h3 {
        text-transform: lowercase;
        text-transform: uppercase;
    }

    span.third {
        background-color: pink;
    }

    img {
        width: 200px;
        /* 设置文字与图片对齐方式
        vertical-align 
            可选值:bottom 底部对齐
                   top：顶部对齐
                   baseline:基线对齐
        取消图片在默认情况下垂直方向的空白
            属性值除baseline */

        /* vertical-align: baseline; */
    }

    div.img1 {
        background-color: blue;
       
    }

文字样式的简写：
font：文字简写的时候记得一定要写文字字体、文字大小，并且这二个属性值在后面二个,除了字体颜色,
可以在字体大小后用/添加行高