CSS设置文本——对齐、修饰、缩进
<1>.对齐文本
1 <html>
2 <head>
3 <style type="text/css">
4 h1 {text-align: center}
5 h2 {text-align: left}
6 h3 {text-align: right}
7 </style>
8 </head>
9
10 <body>
11 <h1>这是标题 1</h1>
12 <h2>这是标题 2</h2>
13 <h3>这是标题 3</h3>
14 </body>
15 </html>
这个CSS的用法和HTML中的用法差不多。
不过，好像这个方法更好用一点。
<2>.修饰文本
1 <html>
2 <head>
3 <style type="text/css">
4 h1 {text-decoration: overline}
5 h2 {text-decoration: line-through}
6 h3 {text-decoration: underline}
7 h4 {text-decoration: blink}
8 a {text-decoration: none}
9 </style>
10 </head>
11
12 <body>
13 <h1>这是标题 1</h1>
14 <h2>这是标题 2</h2>
15 <h3>这是标题 3</h3>
16 <h4>这是标题 4</h4>
17 <p><a href="http://www.w3school.com.cn/index.html">这是一个链接</a></p>
18 </body>
19 </html>
blink是闪烁的意思。可以看到，在用了这个技术之后，
在HTML下的超链接的下划线没有了。
那个line-through是十分有用的。比如商城中
某件物品降价了，这时就可以将原来的那个价格
用上这个技术了。
<3>.缩进文本
1 <html>
2 <head>
3 <style type="text/css">
4 p {text-indent: 2em}
5 </style>
6 </head>
7
8 <body>
9 <p>
10 这是段落中的一些文本。
11 这是段落中的一些文本。
12 这是段落中的一些文本。
13 这是段落中的一些文本。
14 这是段落中的一些文本。
15 这是段落中的一些文本。
16 这是段落中的一些文本。
17 这是段落中的一些文本。
18 这是段落中的一些文本。
19 这是段落中的一些文本。
20 这是段落中的一些文本。
21 这是段落中的一些文本。
22 </p>
23 </body>
24 </html>
indent就是缩进的意思。
这个才是真正的段落呀。
有了这个技术之后，就不用在用空格
来搞缩进了。
posted on 2011-09-17 21:21 More study needed. 阅读(1872) 评论(0) 编辑 收藏 举报
