CSS学校笔记 002

63 阅读1分钟

image.png

image.png

image.png

56f2aea646fd2f90a2eb07899aef62f.jpg

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			* {
				font-size: 30px;
				color: rgb(56, 81, 195);
                /* 字符间距letter-spacing */
				letter-spacing: 5px;
			}
            body{
				height:2000px;
				/* 图片不重复no-repeat  图片固定fixed*/
				background:yellow url(image/1.jpg) no-repeat center center fixed;
				background-size: 100% 100%;
			}
			.big {
				font: italic bold 1.5em 华文细黑;
				color: red;
				text-decoration: line-through;
			}

			.me {
				font: italic 2em 幼圆字体;
				color: #00ffff;
				/* 装饰线text-decoration */
				text-decoration: underline;
			}

			#eye {
				font-weight: bold;
				font-size: 20px;
				color: #f00;
				text-decoration: overline;
			}

			#box {
				/* rgba可以调整透明度 */
				background-color:rgba(226,226,226,0.5);
				/* 对齐 */
				text-align: center;
				/* 首行缩进 */
				text-indent: 5em;
				/* 行高 */
				line-height: 400px;
			}
		</style>
	</head>
	<body>
		<!-- 一般给div设置id -->
		<div id="box">
			<span class="big">黑夜</span>给了<span class="me"></span>一双<span class="big">黑色</span><span
				id="eye">眼睛</span><span class="me"></span>却用它来寻找<span class="big">光明</span></div>
	</body>
</html>