CSS文本属性

CSS文本属性

1. CSS Text（文本）属性定义文本的外观，比如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等

2. 文本颜色

   • color属性定义文本的颜色

   • <style type="text/css">
         div{
             color:red;
         }
     
     </style>
     

     • 表示	属性值
       预定义颜色值	red、green....
       十六进制	#FF0000,##FF6600....
       RGB	rgb（255，0，0）或者rgb（100%，0%，0%）

3. 对齐文本

   • text-align属性用于元素内文本内容的水平对齐

   • <style type="text/css">
         div{
             text-align:center;
         }
     
     </style>
     

   • 属性值	解释
     left	左对齐
     right	右对齐
     center	居中对齐

4. 装饰文本

   • text-decoration属性规定添加文本的装饰，可以给文本添加下划线、删除线、上划线

   • <style type="text/css">
         div{
             text-decoration:underline;
         }
     </style>
     

   • 属性值	描述
     none	默认。没有装饰线
     underline	下划线。链接<a> 自带下划线
     overline	上划线
     line-through	删除线

5. 文本缩进

   • text-indent属性用来指定文本的第一行缩进，通常是将段落的首行缩进

   • <style type="text/css">
         div{
             text-indent:2em;
         }
     </style>
     

   • em是一个相对单位，就是当前元素（font-size）1个文字的大小，如果当前元素没有设置大小，则会按照元素的1个文字大小

6. 行间距

   • line-height属性用于设置行间的距离（行高），可以控制文字行与行之间的距离

   • <style type="text/css">
         div{
             line-height：26px;
         }
     </style>
     

   • 行间距包括：上间距、文本高度、下间距

属性	表示	说明
color	文本颜色	通常使用十六进制
text-align	文本对齐	可以设定文字水平的对齐方式
text-indent	文本缩进	通常缩进两个字符，用2em表示
text-decoration	文本装饰	underline增加下划线，none取消下划线
line-height	行高	控制行与行之间的距离