css颜色

1.前景色
<style type="text/css">
			body {
				padding: 20px;
				font-family: Arial, Verdana, sans-serif;}
			/* color name */
			h1 {
				color: DarkCyan;}
			/* hex code */
			h2 {
				color: #ee3e80;}						/* rgb value */
			p {
				color: rgb(100,100,90);}
		</style>
三种表示方式。颜色名，十六进制，rgb
2.背景色
<style type="text/css">
			body {
				background-color: rgb(200,200,200);
				color: white;
				padding: 20px;
				font-family: Arial, Verdana, sans-serif;}
			h1 {
				background-color: DarkCyan;
				padding: inherit;}
			h2 {
				background-color: #ee3e80;
				padding: inherit;}
			p {
				background-color: white;
				color: rgb(100,100,90);
				padding: inherit;}
		</style>
同样三种表示方式。
3.透明度
div {
				width: 100px;
				height: 100px;
				margin: 40px;
				display: inline-block;
				background-color: #ee3e80;}
			p {
				width: 100px;
				height: 100px;
				position: relative;
				top: 20px;
				left: 20px;
				margin: 20px;}
			p.one {
				background-color: rgb(0,0,0);
				opacity: 0.5;}
			p.two {
				background-color: rgb(0,0,0);
				background-color: rgba(0,0,0,0.5);}

opcaity允许指定透明度。介于0.0至1.0之间
rgba除了红绿蓝最后一个值是透明度。
4.HSl和hsla
<style type="text/css">
			body {
				background-color: #C8C8C8;
				background-color: hsl(0, 0%, 78%);
				color: white;
				padding: 20px;
				font-family: Arial, Verdana, sans-serif;}
			h1 {
				background-color: DarkCyan;
				padding: inherit;}
			h2 {
				background-color: #ee3e80;
				padding: inherit;}
			p {
				background-color: #ffffff;
				background-color: hsla(0,100%,100%,0.5);
				color: #64645A;
				padding: inherit;}
		</style>
hsl：参数为 色调，饱和度，明度
hsla加了一个透明度。