CSS 文本

CSS - 文本颜色

color 设置文本颜色

body{color: #666666;}
p{color: rgb(255,0,0);}
span{ color: black;}

color的值 :

  • 十六进制值 如: #666666
  • 一个RGB值 如: rgb(255,0,0)
  • 颜色名 如:black

注:设置 body 字体颜色,主体内部能继承这个颜色值

CSS - 对齐方式

text-align 设置对齐方式。值有 : left(默认),center(水平居中),right(向右)。

p{text-align: center;}

text-align 对内联元素无效。可以通过改变内联元素的display,如:

span{
	display: inline-block;
	width: 150px;
	text-align: center;
}

CSS - 文本修饰

text-decoration 设置文本修饰

p{text-decoration: underline;}
a{text-decoration:none;}
  • none - 默认,不修饰文本
  • underline - 文本下的一条线
  • overline - 文本上的一条线
  • line-through - 穿过文本下的一条线

text-decoration 主要是用来取消 <a> 元素的下划线。

CSS - 文本转换

text-transform 设置文本转换。文本转换属性是用来指定在一个文本中的大写和小写字母。

可用于所有字句变成大写或小写字母,或每个单词的首字母大写。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>pangugle 教程</title>
		<style>
			p.uppercase {text-transform:uppercase;}
			p.lowercase {text-transform:lowercase;}
			p.capitalize {text-transform:capitalize;}
		</style>
	</head>
	<body>
		<p class="uppercase">set:text-transform</p>
		<p class="lowercase">set:text-transform</p>
		<p class="capitalize">set:text-transform</p>
	</body>
</html>
  • uppercase - 全部大写字母
  • lowercase - 全部小写字母
  • capitalize -文本中的每个单词以大写字母开头

css_text_1.jpg

图一

CSS - 文本缩进

text-indent 设置文本缩进

p {text-indent:50px;}