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

CSS学习笔记之文本属性

2016-09-10 09:19 543 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>

<style type="text/css">
#p1
{
word-spacing:20px;      		/* 设置单词(英文)之间的间距 */
letter-spacing:10px;    		/* 设置字符(汉字)之间的间距 */
text-align:left;        		/* 设置文本的对其方式 */
text-indent:30px;       		/* 设置文本首行缩进(单位是30px) */
text-indent:3em;				/* 设置文本首行缩进(单位是3个字符) */
line-height:30px;       		/* 设置行间距 */

text-transform:none;			/* 不做任何改变 */
text-transform:uppercase;		/* 设置所有字符全部大写 */
text-transform:lowercase;		/* 设置所有字符全部小写 */
text-transform:capitalize;		/* 设置每个单词的首字母大写 */

text-decoration:none;			/* 不做任何改变 */
text-decoration:underline;		/* 设置下划线 */
text-decoration:overline;		/* 设置上划线 */
text-decoration:line-through;	/* 设置删除线 */
text-decoration:blink;			/* 设置文本闪烁 */
text-decoration:underline overline;	/* 组合设置,使文本既有下划线,又有上划线 */

white-space:normal;				/* 对空白符的默认处理:换行、tab和多个空格全部处理成一个空格 */
white-space:nowrap;				/* 禁止换行,所有文本都显示在一行中,除非使用<br/>标签。 */
white-space:pre;				/* 保留所有空格、换行和tab等 */
white-space:pre-wrap;			/* 保留换行和空格 */
white-space:pre-line;			/* 保留换行,但不保留空格 */
}
#p2
{
background-color:red;
}
</style>
</head>
<body>
<p id="p1">CSS是Cascading Style Sheet       这个几个英文单词的缩写,     翻译成中文是“层叠样式表”的意思。
CSS能让网页制作     者有效的定制、改善网页的效果。CSS是对
HTML的补充,网页设计师曾经为         无法很好的控制
网页的显示效果而
倍感苦恼,CSS                 的出现解决了这个问题。</p>
<p id="p2">今天天气好晴朗,处处好风光</p>
</body>
</html>


页面效果:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: