详解：31 king案例

贵哥的编程之路

发布于 2020-10-28 12:08:14

2330

发布于 2020-10-28 12:08:14

核心：形成这个的核心是font:bold 100px georgia;，单这个的效果是

请记住，它那些发光发亮的是用文字阴影做到的，问题？那css代码中那一段代码能做到呢？ text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #abcdef, 0 0 80px #aabcde, 0 0 150px #abc; 问题？那我请问一下这一段代码的意思是什么？核心又是什么呢？ /添加多个阴影效果在同一个text上，请记住，最核心的地方在于他是6个都发光，所以光很大啊，这种光我称他为增强光。你看到了嘛？20px模糊 #fff，发什么颜色的光。。。。。，所以要增强光就这样把/

核心之外的我也讲一点把 height: 300px; text-align:center; line-height: 300px; 代表水平垂直文字居中，必须描述的是文字哦哈哈哈 background-color: #000;背景哈

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		.test{
			font:bold 100px georgia;
			height: 300px;
			background-color: #000;
			text-align:center;
			line-height: 300px;

			text-shadow: 0 0 10px #fff,
			0 0 20px #fff,
			0 0 30px #fff,
			0 0 40px #abcdef,
			0 0 80px #aabcde,
			0 0 150px #abc;

		}
	</style>
</head>
<body>

<!-- <div class="shadow">Mr.King</div> -->
<div class="test">Mr.King</div>

</body>
</html>