尚硅谷web前端工程师1000集学习笔记24

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>颜色的单位</title>
		<style type="text/css">
			
			.box1{
				width: 100px;
				height: 100px;
				
				/*
				 * 颜色单位:
				 * 	 在CSS可以直接使用颜色的单词来表示不同的颜色
				 * 		红色:red
				 * 		蓝色:blue
				 * 		绿色:green	
				 *   也可以使用RGB值来表示不同的颜色
				 * 		- 所谓的RGB值指的是通过Red Green Blue三元色,
				 * 			通过这三种颜色的不同的浓度,来表示出不同的颜色
				 * 		- 例子:rgb(红色的浓度,绿色的浓度,蓝色的浓度);
				 * 			- 颜色的浓度需要一个0-255之间的值,255表示最大,0表示没有
				 * 			- 浓度也可以采用一个百分数来设置,需要一个0% - 100%之间的数字
				 * 				使用百分数最终也会转换为0-255之间的数
				 * 				0%表示0
				 * 				100%表示255
				 *   也可以使用十六进制的rgb值来表示颜色,原理和上边RGB原理一样,
				 * 		只不过使用十六进制数来代替,使用三组两位的十六进制数字来表示一个颜色
				 * 		每组表示一个颜色	,第一组表示红色的浓度,范围00-ff
				 * 					第二组表示绿色的浓度,范围是00-ff
				 * 					第三组表示蓝色的浓度,范围00-ff
				 * 		语法:#红色绿色蓝色
				 * 		十六进制:
				 * 		0 1 2 3 4 5 6 7 8 9 a b c d e f
				 * 		00 - ff
				 * 		00表示没有,相当于rgb中的0
				 * 		ff表示最大,相当于rgb中255
				 * 		红色:
				 * 			#ff0000
				 * 		像这种两位两位重复的颜色,可以简写
				 * 			比如:#ff0000 可以写成 #f00
				 * 			#abc  #aabbcc		
				 * 			
				 */
				/*background-color: rgb(161,187,215);*/
				
				/*background-color: rgb(100%,50%,50%);*/
				
				/*background-color: #00f;*/
				
				/*background-color: #abc;*/ /*#aabbcc*/
				
				background-color: #084098;
			}
			
		</style>
	</head>
	<body>
		<div class="box1"></div>
	</body>
</html>
发布了37 篇原创文章 · 获赞 3 · 访问量 792

猜你喜欢

转载自blog.csdn.net/qq_38547320/article/details/104362675