web学习CSS3：文本样式

1.标签设置字体（已废弃）

 
CSS层叠样式

2.文字样式属性

2.1 font-family

1

2

3

2.2 font-size 文字大小

绝对单位

相对单位

2.2.1 px（手机端一般不使用px）

分辨率越低越大

p{font-size: 50px;}

文字大小px,受显示器分辨率影响

2.2.2 larger 和 smaller

        .larger{font-size: larger;}
        .smaller{font-size: smaller;}

     
文字大小相对于父元素的文字大小变大
     
文字大小相对于父元素的文字大小变小

2.2.3 em和%都是针对父元素

1

2

2.2.4 字体大小可以继承(只能继承父元素绝对值大小)

    
    

  
     

         
文字大小相对值em
         
文字大小相对值%
     

3.字体颜色

1

256色里有40种颜色在Macintosh和Windows里显示的效果不一样，所以能安全使用的只有216色。为了尽量让用户看到色彩相同的网页，请尽量使用下面的216色。
web安全色

4.其他样式

4.1加粗font-weight

4.2设置斜体font-style

normal 正常、italic 斜体、oblique倾斜,一般使用italic

4.3 设置元素中文本为小型大写字母font-variant

5.简写font属性

6.文本对齐方式text-align

text-align 可以继承

7.行高line-height

浏览器有默认行高,行高可以继承，但是不要继承。子类重新写。

8.vertical-align

默认值是 baseLine，只对行内元素和单元格元素起作用

基线

设置行高后%为 1.5em的百分比

可以给单元格加垂直对齐方式

图片.png

单行文字居中

图片.png

多行文字居中

1.设置父元素 display：table
2.设置自己display:table-cell
3.此时设置自己居中显示verical-align(只能设置行内元素或者单元格，div为块级元素)

9.word-spacing和letter-spacing和text-transform

图片.png

图片.png

去除a链接中的下划线