阿七
级别: 未验证会员
精华:
0
发帖: 909
威望: 0 点
金钱: 2161 RMB
贡献值: 0 点
在线时间:512(小时)
注册时间:2006-03-29
最后登录:2008-08-07
|
CSS实用教程（二）
七．控制文字的样式 E0w>c'kH
\'shnzs
控制文字的样式包括文字大小写、文字修饰两个部分。 ZT!DTb
B
I~Ziq10
1．文字大小写 f>dWl$/_s
zXB.)4T
文字大小写使网页的设计者不用在输入文字时就完成文字的大小写，而可以在输入完毕后，再根据需要对局部的文字设置大小写。 XvWUJ6
M
& GX
pRo
基本格式如下： v. !L:1@I.
>Qr(#Bt)
text-transform: 参数 &W*9' vSm.
d(<[$ 3.
参数取值范围： BT qY _9
THC34u]
·uppercase：所有文字大写显示 ZJ1 %
NLRgL'+F
·lowercase：所有文字小写显示 !c/ G'se
e2~&I`ct
·capitalize：每个单词的头字母大写显示 Xi$2MyRd
3U ^E<H
·none：不继承母体的文字变形参数 {wVj-w=<W
X|++K;rtfE
注意：继承是指HTML的标识符对于包含自己的标识符的参数会继承下来。 UU~S{!*+L
6B'd]Fe
2．文字修饰 s|FfBG
sF[7pE
文字修饰的主要用途是改变浏览器显示文字链接时的下划线。 z$C}V/Ey
-*HR0:H
基本格式如下： -k(bM:
<a_ytSoG 1
text-decoration: 参数 O(pa;&"
_!_%Afz
参数取值范围： w\SfzJN
xQ~} 9Kt\
·underline：为文字加下划线 `0)'&HbLY
Ry_"so w4
·overline：为文字加上划线 m6+4}= Cn
7UnB]- :.
·line-through：为文字加删除线 #z$g 1\v
4 s&9A/&pC
·blink：使文字闪烁 O>
.g cLA
$e#V^dph
·none：不显示上述任何效果 LKX; ^
C] dK/~Z#r
八．控制文本的样式 2,T^L (]
@T 5dPmn
控制文本的样式包括单词距离、字母距离、文本行距、文本水平对齐、文本垂直对齐文本缩进六个部分。 yUY* l@v]
vXI2 u;=y
1．单词间距 4;;K1< 1
2
W F7^$^:
单词间距指的是英文每个单词之间的距离，不包括中文文字。 Thc"QIk&4
u*"mdL2
基本格式如下： G _1`NyI
i!KZg74V
word-spacing: 间隔距离 7iijATc
$-*E
间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等。 6R=dg2tKT
j84g6; 4Dv
2．字母间距 ?7| 6jTIs
XLq%nVBM8\
字母间距是指英文字母之间的距离，功能、用法，以及参数的设置和单词间距很相似。 n`TXm g
7SVq fWp
基本格式如下： kD ?lMA__
7#pu(:T$
letter-spacing: 字母间距 /9 wmc2
A8jj]J+
3．行距 Nk
~"f5q7
~k[mowz0
行距是指上下两行基准线之间的垂直距离。一般地说，英文五线格练习本，从上往下数的第三条横线就是计算机所认为的该行的基准线。 hH3~O`
~
E9]\ I> v
基本格式如下： *;u'W|"/~
;jZf VRl
line-height: 行间距离 s k>E(Myo
X8uAwHa6F
行间距离取值： knb 9s `wR
f8JWg9 m
·不带单位的数字：以1为基数，相当于比例关系的100% a\]g lw\;
='z4bU
·带长度单位的数字：以具体的单位为准 ymo].
6-6ha7]s
·比例关系 wUJ>?u9
0~( f<:
注意：如果文字字体很大，而行距相对较小的话，可能会发生上下两行文字互相重叠的现象。 i+XHXpk
vOV$H le
4．文本水平对齐 y c:y}"
- :~"c@D
文本水平对齐可以控制文本的水平对齐，而且并不仅仅指文字内容，也包括设置图片、影像资料的对齐方式。 K?$|Y-_D^M
qC4 Q+"'
基本格式如下： q> 5 K:5
ve&"x Nz<
text-align: 参数 W^" C|4G }
hcX` X2^
参数的取值： 6*r#m%|
`2l
j{N
·left：左对齐 /]>8V'e\
HY>zgf, 0
·right：右对齐 hRaX!QcG3
{
\p&?
·center：居中对齐 rF\L}& Sw
/^rJ`M[;
·justify：相对左右对齐 155vY
@|6#]&v`
但需要注意的是，text-alight是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。 }-N4D"d4o
6R'z3[K9
5．文本垂直对齐 ./i 5VBP5
WWgJ !Uz
文本的垂直对齐应当是相对于文本母体的位置而言的，不是指文本在网页里垂直对齐。比如说，表格的单元格里有一段文本，那么对这段文本设置垂直居中就是针对单元格来衡量的，也就是说，文本将在单元格的正中显示，而不是整个网页的正中。 8k9Yoh t
k
ps}i~Jb
基本格式如下： K)N'~jCG
c0f8*O4i
vertical-align: 参数 ]47! Zo,
["0DXm%t
参数取值： E++3GagdiD
7 0Wy]8<P
·top：顶对齐 ( q}{ ;
o-+H-
·bottom：底对齐 bPA1>p7
%0q
)PT\
·text-top：相对文本顶对齐 ~t Zy
-1
D!rD-e
·text-bottom：相对文本底对齐 vRMGNz_P7[
$
E-c%-
·baseline：基准线对齐 so_^%)
gdJ
48LzI@H&
·middle：中心对齐 ?o`fX
wE
ZN}U^9m=
·sub：以下标的形式显示 C] M{
?P"j5
·super：以上标的形式显示 >o5eyi
o?><(A|
6．文本缩进 sfR0wEqI
O#
` y;%
文本缩进可以使文本在相对默认值较窄的区域里显示，主要用于中文板式的首行缩进，或是为大段的引用文本和备注做成缩进的格式。 (|sqN8SbA
XL`i9kV?
基本格式如下： NT<}-^
ZG)6{WS
text-indent: 缩进距离 e!P]$em|1E
ew1bb K>
缩进距离取值： uZ+vY F^
b ix}#M
·带长度单位的数字 Rip[
T ^H`$;\
·比例关系 :JCe,1!3@
X_#,5 t=7
但是需要注意的是，在使用比例关系的时候，有人会认为浏览器默认的比例是相对段落的宽度而言的，其实事实并非如此，整个浏览器的窗口才是浏览器所默认的参照物。 c{!X DiT]P
4H hQzVM{
另外，text-indent是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。
|
|
|
|
[楼 主]
|
Posted: 2006-04-04 13:44 |
| |
常州五颜六色网络技术有限公司 -> 网站建设 -> CSS实用教程（二）
