阿七
级别: 未验证会员
精华:
0
发帖: 909
威望: 0 点
金钱: 2161 RMB
贡献值: 0 点
在线时间:512(小时)
注册时间:2006-03-29
最后登录:2008-08-07
|
CSS实用教程（二）
七．控制文字的样式 }F4
FrryZe=
控制文字的样式包括文字大小写、文字修饰两个部分。 . 'rC'F T
Vy[ m%sEP
1．文字大小写 seo.1.Da2
j -j,0!T~b
文字大小写使网页的设计者不用在输入文字时就完成文字的大小写，而可以在输入完毕后，再根据需要对局部的文字设置大小写。 (}LLk +
z wJ Vi9sO
基本格式如下： $'>h7].
Z6x M(* vg
text-transform: 参数 2k$~Mv@L
)j>BvO
参数取值范围： 1W
+Q cK4k
L
H`z '7&/
·uppercase：所有文字大写显示 i'bUX=JK
D27MT/=7
·lowercase：所有文字小写显示 O}I
RM|r"
I
DpW5 Dc
·capitalize：每个单词的头字母大写显示 MKN],l
N
d2e4=/ A%
·none：不继承母体的文字变形参数 `upxM0gc
1v ^eXvY
注意：继承是指HTML的标识符对于包含自己的标识符的参数会继承下来。 [10;Mg
ZBAtRs
2．文字修饰 x# {.mN
u \zP`Y
文字修饰的主要用途是改变浏览器显示文字链接时的下划线。 (\M&Q- xZ
M '4$z^@Z
基本格式如下： Ee cV%E
1k8zAtuj
text-decoration: 参数 dNL<O
Q{0!N8']"
参数取值范围： _v9P0W^.7
S EeDq/h
·underline：为文字加下划线 # ,KjJ
hvS4"% \
·overline：为文字加上划线 xC ,;IS k,
<+oTYPgD9
·line-through：为文字加删除线 TEK]$%2
[*k 25N
·blink：使文字闪烁 +W6QtB6
VkNg Vjg
·none：不显示上述任何效果 [0(+E2/:2
d}.*hgk
八．控制文本的样式 l?N|Gj;ZFZ
zNs8yMnFr
控制文本的样式包括单词距离、字母距离、文本行距、文本水平对齐、文本垂直对齐文本缩进六个部分。 Z7X_U` Q
VNmQ'EuV}2
1．单词间距 fgW>U*.ar
O
7_u9lz2
单词间距指的是英文每个单词之间的距离，不包括中文文字。 v?U;o& L(
ug wZAC
基本格式如下： FKOTv2
J\BTrN7
word-spacing: 间隔距离 o-))R| ~z
\C
)S3!h
间隔距离的取值：points、em、pixes、in、cm、mm、pc、ex、normal等。 t@`w}o[#
7$l!f
2．字母间距 "lFS{7
6i6 m*=h
字母间距是指英文字母之间的距离，功能、用法，以及参数的设置和单词间距很相似。 u]W$' MyY
@MS}t Z5
基本格式如下： xb2 xl.2x!
g/o@,_
letter-spacing: 字母间距 J 8z |ua
<}@*i
3．行距 `Dc k$
R| jt mI?
行距是指上下两行基准线之间的垂直距离。一般地说，英文五线格练习本，从上往下数的第三条横线就是计算机所认为的该行的基准线。 m0I)_R#X[
&D X&*Xq2
基本格式如下： % Rv ;e
8QYP\7}o
line-height: 行间距离 A)2eo<ij4
k
$kOp *X
行间距离取值： =N 62 ){{
Y ]xFe>
·不带单位的数字：以1为基数，相当于比例关系的100% _ (U|Kpi
\iBEyr]
·带长度单位的数字：以具体的单位为准 kBh*@g f
;;^OKrzWW
·比例关系 N)kZ2|oD
k10g %K4g
注意：如果文字字体很大，而行距相对较小的话，可能会发生上下两行文字互相重叠的现象。 5^,"Ve|
J v,*rQH
4．文本水平对齐 #~_ZG% u
5 f~49(v]
文本水平对齐可以控制文本的水平对齐，而且并不仅仅指文字内容，也包括设置图片、影像资料的对齐方式。 >@Nn_d
X,] E {
基本格式如下： c:J;Q){Xz
8|z@"b l)
text-align: 参数 H%peE9>$
(bX77 Xr
参数的取值： !OCb^y
ujLz<5gKuO
·left：左对齐 T{US zMj
\y7kb
·right：右对齐 %Kk MWl&:
QY^v*+lr\
·center：居中对齐 mRECd Gst
;8~tt I
·justify：相对左右对齐 nNEIwlj;
W Z A8D0[
但需要注意的是，text-alight是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。 \# hp,XV>
C $<['D?8
5．文本垂直对齐 Iy V%tOy
(6Y.|u]bq
文本的垂直对齐应当是相对于文本母体的位置而言的，不是指文本在网页里垂直对齐。比如说，表格的单元格里有一段文本，那么对这段文本设置垂直居中就是针对单元格来衡量的，也就是说，文本将在单元格的正中显示，而不是整个网页的正中。 Pf,lZU?f
>.76<f ni
基本格式如下： O$K ?2-
YQ`m;<
vertical-align: 参数 s?,\aSsU@
/SvB
w>gQ
参数取值： FQgc\-8tm
:&'[#%h8
·top：顶对齐 @((Y[ <
2Sha&Z*CE
·bottom：底对齐 ,WKWin
s6YnNJ,SK
·text-top：相对文本顶对齐 XZew$Om[
,Q ZNH?Cp/
·text-bottom：相对文本底对齐 q Q/<\6Sl
T:G8xI1
P
·baseline：基准线对齐 s q;nUA=
.1@8rVp7
·middle：中心对齐 ndE"v"_H
\5q0nB@i5y
·sub：以下标的形式显示 : 6| nXL
i9O;D*
·super：以上标的形式显示 Tz<@k
}^"#&w3<
6．文本缩进 KM&bu='L^
!gX(Vh*k
文本缩进可以使文本在相对默认值较窄的区域里显示，主要用于中文板式的首行缩进，或是为大段的引用文本和备注做成缩进的格式。 D:DtP6
}u&,;]
基本格式如下： 1!"iN~
J!"#N }[
text-indent: 缩进距离 U_oei3QP
k>W}9^ cK
缩进距离取值： F*{1, gb
I;rh(FMV
·带长度单位的数字 E!]d?t 3
b
*m.4)2u=
·比例关系 +T*]!9%<`:
"}ZUa~7
但是需要注意的是，在使用比例关系的时候，有人会认为浏览器默认的比例是相对段落的宽度而言的，其实事实并非如此，整个浏览器的窗口才是浏览器所默认的参照物。 : kw14?]_
*If ]f0?%
另外，text-indent是块级属性，只能用于< p>、< blockquqte>、< ul>、< h1>~< h6>等标识符里。
|
|
|
|
[楼 主]
|
Posted: 2006-04-04 13:44 |
| |
常州五颜六色网络技术有限公司 -> 网站建设 -> CSS实用教程（二）
