第三天 文字相关款式
1）容易混淆或遗忘的单位
比较有意思的景象：国外的设计师们喜欢用em、百分比、关键字（small、xx-small之类）等设置网页字体大小，国内喜欢用px和pt（留意，如果网页都用em作为单位，ie6会出现bug，可以指定任意一个百分比处理）
浏览器默认的字体大小是16px
在中文window系统中，ie浏览器默认中文字体是宋体或新宋体，英文为Arial，其它浏览器则未知（新的浏览器都可以用户指定页面中跌字体，即字体可配置），定义font-family时，尽量备用几个字体，由于用户操作系统中未必装有你定义的字体，如：font-family:“宋体”,Arial,Helvetica,sans-serif;
xx-small(=9px),x-small(=11px),medium(-16px),large(=19px),x-large(=23px),xx-large(=27px)
1em (= 100%),  0.5em (= 50%)
2em或者200% 单位是指2倍于父级元素的字体大小，如果父元素没有字体大小，则自动向上承继祖先元素的字体大小。
font: italicsmall-caps bold 12px/1.6em 宋体      含义为：文本为斜体、大写、加粗显示，字体大小为12像素，行高为字体大小的1.6倍，字体为宋体。
2）serif和sans-serif
2-1）serif：衬线字体，比较常见的衬线字体有 Georgia, Garamond, Times New Roman, 中文的宋体等等。衬线字体的可读性非常好，所以它使用的最多的地方也正是出版物或者印刷品的注释内容等以大段文字作为表现方式的作品上
2-2）sans-serif：非衬线字体（sans为“法语”中没有的意思），常见的无i衬线字体有 Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, 中文的幼圆、隶书等等，无衬线字体比较圆滑，线条普通粗细均匀。比较适合用作艺术字、标题等。由于无衬线字体通常粗细比较均匀，所以在小字体显示的时候，可读性会降低，容易惹起视觉疲劳。
具体衬线字体和非衬线字体的区别见：点击打开链接
3）规划对齐
3-1）在table中比较容易，通过在单元格中设置align的“left,right,center,justify”对齐，或者valign的"top,bottom,middle,baseline”等
3-2）规划居中
text-align在做规划居中时，常常会发现文本居中了，但是图片等不居中景象，ie没有此问题。处理此问题常常配合margin设置auto属性处理，如下：
body{ text-align:center;}
div{margin-left:auto;margin-right:auto;width:60%}
3-3）垂直规划
vertical-align仅能作用于单元格或者图像显示而定义的，所有用于文本对齐时，需求制定display:table-cell,但是ie并不支持table-cell，因此可以利用line-height和height处理ie下面文本垂直对齐问题
a)firefox等文本对齐到两头方法：
div{vertical-align:bottom;display:table-cell}
b)兼容ie的处理方法:
div{line-height:6em;height:6em}
4) 什么样的行高最适合阅读
浏览器默认是120%，最适合的是160%~180%
在做距离拉伸时，line-height常常在firefox中无效，因此建议用更为安全的padding和margin
5）字体颜色
16进制简写方式即为16进制中一种严责分歧时的简写，例如#f00,等于#ff0000;#112233,等于#123
css3中除了十六进制、简写16进制、英文名、RGB、 百分比RGB以外，还添加了3种描述颜色的：
a）RGBA，即在RGB基础上添加了Alpha通道，用于通明
b）HSL：H:色相，S：饱和度，L：亮度，color：hsl(0,100%,100%)表示红色
c）HSLA：即在HSL基础上添加Alpha通道
PS: 居中规划较为常用，也较为重要。大家常见了借助父类div的relative属性、父标签left和top设定为50%，然后用负margin等都可以实现。大家可以查阅相关材料
本文链接http://www.cxybl.com/html/wyzz/CSS/20121119/33952.html