CSS字体设置的绝对定义

字体大小

绝对单位所定义的字体大小是固定的,大小显示效果不会受外界因素影响,如in、cm、mm、pt(印刷点数)、pc(1pc=12pt)
相对单位所定义的字体大小不固定,会根据外界环境而改变,如:
px(像素),根据屏幕像素点的尺寸变化而变化。因此,不同分辨率的屏幕所显示的像素字体大小是不同的,屏幕分辨率越大,相同像素的字体就显得越小。
em,根据相对父辈字体的大小来定义字体大小。例如,如果父元素字体大小为12像素,而子元素的字体大小为2em,则实际大小为24px。
%,以百分比的形式定义字体大小,与em效果相同,相对于父辈字体的大小定义字体的大小
larger、smaller这两个关键字将以父元素的字体大小为参考进行换算。

对于网页宽度固定或者栏目宽度固定的布局,使用像素是正确的。
对于页面宽度不固定或者栏目宽度也不固定的页面,此时使用百分比或em是一个正确的选择
从用户易用性角度,定义字体大小应该以em(或%)为单位进行设置。主要考虑因素是:一方面有利于客户端浏览器调整字体大小;另一方面,通过设置字体大小的单位为em或%,这样使字体能够适应版面宽度的变化。

字体颜色

1、使用颜色名:color:gray
2、使用16进制:color:#666666     (分别对应rgb的16进制)
3、使用rgb:color:rgb(120,120,120)或者rgb(50%,50%,50%)
4、使用rgba:color:rgba(255,0,0,5)(最后一个参数表示透明度)
5、HSL颜色表示法:color:hsl(0,100%,100%)(红色)
6、HSLA颜色表示法:color:hsl(0,100%,100%,5)(半透明红色)

字体粗细

1、font-weight:normal (相当于400)
2、font-weight:700       (相当于bold)
3、font-weight:bolder   (相当于500)

字体倾斜

font-style:normal||italic||oblique              (后两个感觉没啥区别)

字体下划线

text-decoration:none||underline||blink||overline||line-through            (blink闪烁,overline上划线,line-through贯穿线)

字体大小写

font-variant:normal||small-caps
(然而我觉得这个方法好像没什么用)
还有另一种方法
text-transform :none||capitalize||uppercase||lowercase
(none默认值,capitalize将每个单词的首字母大写,uppercase将所有字母大写,lowercase将所有字母小写)

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注