阿七
级别: 未验证会员
精华:
0
发帖: 909
威望: 0 点
金钱: 2161 RMB
贡献值: 0 点
在线时间:512(小时)
注册时间:2006-03-29
最后登录:2008-08-07
|
CSS实用教程（二）
七．控制文字的样式 fB]NEx|o~
3[8p, wx
控制文字的样式包括文字大小写、文字修饰两个部分。 Z*-a=u%gl'
Y?L>KiM$
1．文字大小写 O 0 $V+fE
2'-84
文字大小写使网页的设计者不用在输入文字时就完成文字的大小写，而可以在输入完毕后，再根据需要对局部的文字设置大小写。 :Gew8G
>8b%*f 8R
基本格式如下： O%haaL\
;--D?Gs]Qr
text-transform: 参数 7 |GSs=
z 4;@"B
参数取值范围： 5:C>:pA V
lxr;AJ(
·uppercase：所有文字大写显示 K\59vtga
z ^s\&gix
·lowercase：所有文字小写显示 X *:,|
[rL 8L6,!
·capitalize：每个单词的头字母大写显示 |~PaCw8-ge
\Hf/8!q
·none：不继承母体的文字变形参数 Z`U+ a
+S` cUn7
注意：继承是指HTML的标识符对于包含自己的标识符的参数会继承下来。 M 'F <1(
s|`wi} "x
2．文字修饰 '@Yp@
_
\ 9iiS(e
文字修饰的主要用途是改变浏览器显示文字链接时的下划线。 gS@<sO$d>
E!BzE_|i
基本格式如下： _N)&<'lB<
5 jUy[w @
text-decoration: 参数 Yl:[b{Py
y n_.
参数取值范围： O:GAS [O`
vxLr 034
·underline：为文字加下划线 _[-W*,xJ)
O&yAFiCd
·overline：为文字加上划线 ezCJq`b
~8"oH5
·line-through：为文字加删除线 !n P4S)A
S bzJeaZv
·blink：使文字闪烁 g_N^Y
S~E@A.7
·none：不显示上述任何效果 Cb`, N
\nPf\6;M
八．控制文本的样式 Cl-P6NlR".
yT5OFD|T
控制文本的样式包括单词距离、字母距离、文本行距、文本水平对齐、文本垂直对齐文本缩进六个部分。 } .Z `
G6}&k[d5%
1．单词间距 URg
;e M#
w0lgB%97p
单词间距指的是英文每个单词之间的距离，不包括中文文字。 =QbOvIq
p<#aXs jy
基本格式如下： o 9/,@Ri\5
,\c V,$
word-spacing: 间隔距离 CCol>:8{P
EhM=wfGKw
间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等。 FI.F6d)E$
UcOP 0_/
2．字母间距 xkii Qs)
$I>]61l%
字母间距是指英文字母之间的距离，功能、用法，以及参数的设置和单词间距很相似。 eq(h {*rC
cs.t#C
基本格式如下： g,!.`[e'ex
OFyy!r@?
letter-spacing: 字母间距 cNxxX!P/
,Xfu?Yan
3．行距 c s*E9
9d- '%Q>+
行距是指上下两行基准线之间的垂直距离。一般地说，英文五线格练习本，从上往下数的第三条横线就是计算机所认为的该行的基准线。 strM3j##x
?[m1?
基本格式如下： k{{3nenAG
+6P[TqR
line-height: 行间距离 =E%@8ZbK
fpf,gb8[$n
行间距离取值：
KN`k+!@/7
D" $Y, d
·不带单位的数字：以1为基数，相当于比例关系的100% CJ%'VijhD
\G>C{v;
·带长度单位的数字：以具体的单位为准 zPqJeYK
O65`KOPn
·比例关系 saP%T~
aF+Lam(
注意：如果文字字体很大，而行距相对较小的话，可能会发生上下两行文字互相重叠的现象。 ?HZ^V
3~Fag1Hp
4．文本水平对齐 UE"v+GH
BO7HJF)a
文本水平对齐可以控制文本的水平对齐，而且并不仅仅指文字内容，也包括设置图片、影像资料的对齐方式。 av|T|J/(
2&n6:"u |
基本格式如下： X5VNj|IE
l1
'v`!
text-align: 参数 =Q<7 [
{R(CGrI
参数的取值： 7`t"fS
DGb1_2Z Q
·left：左对齐 l W-h
@
@XM*N7
·right：右对齐 Z^%a 1>`
3w"JzC@
·center：居中对齐 0m*b9+ q
Q\kWQOB_
·justify：相对左右对齐 Q;y5E`G
dt "/4wCO
但需要注意的是，text-alight是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。 v9* +@
:2S?|7U4
5．文本垂直对齐 Os$E,4,py
(:OMt2{r
文本的垂直对齐应当是相对于文本母体的位置而言的，不是指文本在网页里垂直对齐。比如说，表格的单元格里有一段文本，那么对这段文本设置垂直居中就是针对单元格来衡量的，也就是说，文本将在单元格的正中显示，而不是整个网页的正中。 1 q-;+Pd;
QCZ88 \jX[
基本格式如下： ;xz_H$g
"J+L]IC?AD
vertical-align: 参数 ^` id/
pIC'nO_
参数取值： EniV-Uj\D
<#?dPDMG.*
·top：顶对齐 dGO FSH
( `bb1gz
·bottom：底对齐 lPxhqF5pP
J~WT;s
·text-top：相对文本顶对齐 {v]L|e%
{
d dKP3}
·text-bottom：相对文本底对齐 :s_.K'4?a
z* jaA;#
·baseline：基准线对齐 oOND]>
&Hp*A ^M
·middle：中心对齐 & tT6.@kH
~$K{E[^<
·sub：以下标的形式显示 bLG7{qp
iZfZF
·super：以上标的形式显示 P
jB Af'
=Mw uhk|*
6．文本缩进 su=MMr>
lmHQ"z 3G
文本缩进可以使文本在相对默认值较窄的区域里显示，主要用于中文板式的首行缩进，或是为大段的引用文本和备注做成缩进的格式。 [XI : Yf
Sz
B<PP2
基本格式如下： ^$'z#ZN1
MnFrQC
text-indent: 缩进距离 _J,rql@nG<
, 5W u
缩进距离取值： P ah@d!%A
5<*E S[S
·带长度单位的数字 f4.jWBF
tL;.vRx
·比例关系 |%5Aku0`s
\j k* Nm8;
但是需要注意的是，在使用比例关系的时候，有人会认为浏览器默认的比例是相对段落的宽度而言的，其实事实并非如此，整个浏览器的窗口才是浏览器所默认的参照物。 C)i8XX
jSvq1$U
另外，text-indent是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。
|
|
|
|
[楼 主]
|
Posted: 2006-04-04 13:44 |
| |
常州五颜六色网络技术有限公司 -> 网站建设 -> CSS实用教程（二）
