文本格式化

1、文本格式化
   1、字体相关
      1、指定字体
         属性:font-family
取值:字体值列表
语法:font-family:value1,value2,value3 ...;
eg :
  font-family:"Microsoft Yahei",Arial,Times;
      2、字体大小
         font-size: px/pt;
页面常用字体大小:
   12px
   18px
   36px
      3、字体加粗
         效果等同于 <b></b>
属性:font-weight
取值:normal / bold / value
 value : 没有单位的数字
         400 - 900


 400 --> normal
 900 --> bold
      4、字体样式
         效果等同于<i></i> 斜体 
属性:font-style
取值:normal / italic
      5、小型大写字母
         属性:font-variant
取值:normal / small-caps;
      6、字体属性
         将所有的字体相关属性放在一个声明中
属性:font
取值:font-style font-varaint font-weight font-size font-family;


eg :
  font:italic small-caps bold 12px "microsoft yahei",Arial;


  font:bold 12px/24px "microsoft yahei",Arial;
    12px(文字大小)/24px(行高)


  font-size:12px;
   2、文本格式


      1、文本颜色
属性:color
取值:颜色单位值
      2、文本排列


         效果等同于 <xx align=""></xx>
水平对齐方式
属性:text-align
取值:left / center / right  / justify
注意：该属性对 行内元素 没有效果
  <span style="text-align:center;">Hello World</span>
      3、文字修饰(线条)
         属性:text-decoration
取值:none / underline(下划线) / overline(上划线) / line-through(删除线)
      4、行高
         1、什么是行高
   当前元素内"一行"数据的高度是多少。如果行高的高度大于文本的高度，那么该行文本会在当前的行高范围内呈"垂直居中"状态显示
2、属性 
   line-height
   取值：以px为单位的数字
3、首行文本缩进
   属性：text-indent
   取值：以px为单位的距离
   eg : text-indent:24px;
4、文本阴影
   属性：text-shadow
   取值：h-shadow v-shadow blur color;
2、表格属性
   1、表格常用属性
      1、尺寸属性
         width , height
      2、内边距
         padding
      3、边框
         border 
 
/*只给表格设置边框，单元格没有*/
table{
border:1px solid red;
}
/*单元格边框，与表格无关*/
td{
border:1px solid red;
}
      4、文本格式化
         font-*
text-*
      5、背景属性
         background-*
      6、vertical-align 
         垂直对齐方式
取值：top / middle / bottom
   2、表格特有样式
      1、边框合并(重要)
         属性：border-collapse
取值：
     separate : 默认值，分离边框
     collapse : 边框合并
      2、边框边距
         相当于 td 的外边距
属性：border-spacing
取值：
      1个值 ：水平 和 垂直间距是相同的
      2个值 ：第一个值表示水平间距，第二个值表示垂直间距
注意：
1、只有表格在分离边框模式下，border-spacing 才会起到作用
2、该属性加在table中
      3、显示规则
         如何布局或显示/解析一个table 。定义加载表格的算法
属性：table-layout
取值：
   auto : 自动表格布局，默认值，列的宽度是由单元格的内容来决定的。
   fixed : 固定表格布局，列的宽度是表格宽度和列宽度一起决定的。
固定表格布局，算法较快，但是不太灵活
自动表格布局，算法较慢，能够反映传统的表格特点