第3章CSS文字效果

3.1 文字样式

3.1.1 字体

    p {font-family:黑体，Arial，宋体，sans-serif;}

        以上CSS代码中声明了4种字体，浏览器渲染字体的规则为：优先选择黑体，如果用户的电脑中没有黑体字体，则选择Arial。如果一直选到最后都没有，则选择浏览器默认的字体。

        如果字体名称中含有空格，则添加这个字体的时候要加上双引号，如”Times New Roman”。

        如果网页中需要特殊字体，也可以通过图形软件做成小的图片插入到网页中

3.1.2 大小

        通过font-size来设置文字大小，该属性值可以是绝对大小也可以是相对大小。

        绝对大小如：

        P {font-size:15px;}

        P {font-size:10mm;}

        常用的绝对单位如下：

绝对单位	说明
in	inch，英寸
cm	centimeter，厘米
mm	millmiter，毫秒
pt	point，印刷点

相对大小如：

    P {font-size:200%;}

    P {font-size:0.5em;}

    P {font-size:15pt;}

相对单位	说明
%	相对于父标签的百分比，如果父标签不存在，则相对浏览器默认字体大小（16px）的百分比
em	相对于父标签字体大小的倍数，如果父标签不存在，则相对浏览器默认字体大小（16px）的倍数
px	pixel，像素

注：绝对大小不随显示器分辨率和父标签的大小而改变；相对大小随显示器分辨率和父标签的大小改变。

3.1.3 颜色

    颜色设置有如下几种方法：

    h{color:red;}

    h{color:#F00;}

    h{color:#FF0000;}

    h{color:rgb(255,0,0);}

    h{color:rgb(100%,0%,0%);}

3.1.4 粗细

         粗细设置有如下几种方法：

         h{font-weight:lighter;}

         h{font-weight:100;}

        h{font-weight:200;}

        h{font-weight:bold;}

        h{font-weight:normal;}

3.1.5 斜体

         斜体设置有如下几种方法：

         h{font-style:italic;}

         h{font-style:normal;}

3.1.6 下划线、顶划线和删除线

         下划线 h{text-decoration:underline;}

         顶划线 h {text-decoration:overline;}

         删除线 h{text-decoration:line-through;}

3.1.7 大小写

         单词首字母大写 p{text-transform:capitalize;}

         全部大写 p {text-transform:uppercase;}

         全部小写 p{text-transfrom:lowercase;}

3.2 段落文字

3.2.1 水平对齐

         左对齐 p {text-align:left;}

         右对齐 p {text-align:right;}

         居中对齐 p {text-align:center;}

         两端对齐 p {text-align:justify;}

3.2.2 垂直对齐

         顶端对齐 p {text-align:top;}

         底端对齐 p {text-align:bottom;}

         中间对齐 p {text-align:middle;}