您的位置:首页 > Web前端 > CSS

CSS设置文本——字母、单词、段落

2011-09-17 22:36 253 查看
<1>字母大小写

<html>
<head>
<style type="text/css">
h1 {text-transform: uppercase}
p.uppercase {text-transform: uppercase}
p.lowercase {text-transform: lowercase}
p.capitalize {text-transform: capitalize}
</style>
</head>

<body>
<h1>This Is An H1 Element</h1>
<p class="uppercase">This is some text .</p>
<p class="lowercase">This is some text .</p>
<p class="capitalize">This is some text .</p>
</body>
</html>


capitalize这个词的意思就是“把……的首字母大写”。

当你看了这个效果之后就一切都明白了。

<2>单词间距

<html>
<head>
<style type="text/css">
p.spread {word-spacing: 30px}
p.tight {word-spacing: -0.5em}
</style>
</head>

<body>
<p class="spread">This is some text.</p>
<p class="tight">This is some text.</p>
</body>
</html>


这个用法可以将外观设置的更加好看。

更加美观。 

<3>段落不换行

<html>
<head>
<style type="text/css">
p {white-space: nowrap}
</style>
</head>

<body>
<p>
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
</p>
</body>
</html>


就目前来看,这个技术好像没有什么用处。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: