css中的字体及文本相关属性

css中的字体及文本相关属性

1.字体相关属性

　　字体主要可以设置color、font-family、font-size、font-size-adjust、font-stretch、font-style、font-weight、text-decoraction、font-variant、text-shadow、text-transform、line-height、letter-spacing、word-spacing这几种属性

　　color即颜色；

　　font-size即字体大小；

　　font-famiy是字体的样式吧；

　　font-size-adjust用于控制不同字体尺寸进行微调；

　　text-decoraction控制字体是否有下划线，修饰线什么的；

　　font-stretch可以控制字体的拉伸或者是压缩；

　　font-style就是字体的文字风格，可以让字体斜体，粗体什么的；

　　font-weight控制字体是否加粗，可以设置normal，lighter，bold,bolder;

　　font-variant控制字体的大小写；

　　text-shadow就是字体阴影嘛，甚至可以添加多个阴影；

　　line-height设置字体的行高；

　　letter-spacing设置字符之间的间隔；

　　word-spacing设置单词之间的间隔；

　　text-transform设置文字的大小写；

2.css3中支持的颜色表示方法

　 主要有一下几种表示方法吧：

　　直接上单词：red，grey，green；

　　用十六进制的方式：#000000~#ffffff；

　　用rgb（）函数表示；

　　用hsl（）函数表示；

　　用rgba（）函数表示，最后的a 主要是设置透明度的；

　　用hslb（）函数表示，最后的a也是表示头透明度的；

3.文本相关属性

　　主要有几种：

　　text-indent：设置文本的缩进；

　　text-overflow控制溢出文本的显示；

　　vertical-align设置文本的竖直对齐方式；

　　text-align设置文本的水平对齐方式；

　　direction：设置文本的显示方向；

　　word-break设置文本内容的换行方式，可以设置为normal，keep-all，break-all；

　　white-space设置文本内容对空格的处理方式，可以设置为normal，nowrap；

　　word-wrap设置文本内容的换行方式，可以设置为normal，break-word（我不知道它和word-break有啥区别，好像一样　　　　　　　　　　的，估计后者针对的浏览器不同吧，对了好像有点针对长单词和URL 的意思）；

4.设置使用服务器端的字体

　　设置方式：

　　<style type="text/css">

　　　　@font-face

　　　　　　{

　　　　　　　　font-family:name;

　　　　　　　　src:url(url) format(fontfarmat);

　　　　　　　　srules;

　　　　　　}

5.一般优先使用客户端的字体为好