520最深情的表白信（代码实现）

最新推荐文章于 2024-04-28 16:45:28 发布

荔枝科研社

最新推荐文章于 2024-04-28 16:45:28 发布

阅读量3.2k

点赞数 6

文章标签： p2p linq 网络协议 html5

本文链接：https://blog.csdn.net/weixin_46039719/article/details/124788573

版权

1 视觉化

2 520最深情的表白信（代码展现）

2.1 准备

2.2 深情的信展现

2.3 代码

1 视觉化

想想那些发明家和他们发明的东西:莱特兄弟和飞机、伊斯曼和电影、爱迪生和灯泡、贝尔和电话。任何被发明或创造出来的东西,都是先源于发明者在心中见到一个景象，这是唯一的方法。他清楚地看见它，然后借由他在内心持续保有那个“成品”的画面，宇宙的力量就通过他，把这成品带来这个世界。这些人都知道这个秘密，他们对无形的事物具有完全的信心，他们明白自己具有撑起宇宙的力量，能把所要发明的事物化为有形。他们的信心与想象，成为人类进化的起因，而我们每天都在享用他们极富创意的心智所带来的好处。

你或许会想:“我可没有这些伟大发明家的头脑”“他们可以想象出这些东西，但我不行”。没有比这更大的假象了。当你继续探索这个秘密的知识，你会知道，你不只和他们拥有了一样的头脑，甚至还比他们更优秀。

—— 丹尼斯·维特利博士

2 520最深情的表白信（代码展现）

2.1 准备

准备几张背景照片：

2.2 深情的信展现

切换到网页中：

2.3 代码

<!DOCTYPE html>
<html>
	<head>
		<title>Valentine Letter</title>

		<style>
			div {background: rgba(255, 0, 0, 0); }

			.container
			{
				width: 800px;
				height: 700px;
				margin: 0 auto 0 auto;
				outline: 1px solid rgba(255, 100, 100, 1);
				overflow: hidden;
			}

			.top
			{
				width: 100%;
				height: 200px;
				overflow: hidden;
			}

			.sky
			{
				width: 400%;
				height: 100%;
				background-position: left top;
				background-repeat: repeat-x;
				margin-left: 0px;
				animation-name: skymove;
				animation-duration: 200s;	
				animation-iteration-count: infinite;
				animation-timing-function: linear;	
			}

			@keyframes skymove 
			{
				0%   {margin-left: 0px;}
				100% {margin-left: -1600px;}
			}		

			.middle
			{
				width: 100%;
				height: 850px;
				margin-top: -200px;
				background-size: cover;
				background-position: middle top;
				background-repeat: no-repeat;
			}

			.letter
			{
				width: 400px;
				height: 500px;
				margin: 0 auto 0 auto;
				background: url("letterbg.jpg");
				background-size: cover;
				background-position: middle top;
				background-repeat: no-repeat;

			}

			.text
			{
				width: 80%;
				margin: 0 auto 0 auto;
				font-family: georgia;
				font-size: 12px;
				font-weight: bold;
				line-height: 2.5em;
			}

			.poem
			{
				font-style: italic;
			}

			.author
			{
				text-align: right;
			}
		</style>

		<script>
			function getTimeBg() 
			{
				var sky = document.getElementById("sky");
				var earth = document.getElementById("earth");

				var d = new Date();
				if (d.getHours() >= 6 && d.getHours() <= 18) {
					sky.style.background = "url(topbg_day.jpg)";
					earth.style.background = "url(middlebg_day.png)";
				}
				else
				{
					sky.style.background = "url(topbg_night.jpg)";
					earth.style.background = "url(middlebg_night.png)";
				}
			}
		</script>
	</head>

	<body onload="getTimeBg()">
		<div class="container">
			<div class="top">
				<div class="sky" id="sky"></div>
			</div>

			<div class="middle" id="earth">
				<br /><br /><br /><br /><br /><br /><br /><br /><br />
				<div class="letter">
					<div class="text">
						<p class="poem">
							<br />
							醇香的红酒为你醉，<br />
							娇美的玫瑰为你艳，<br />
							炽热的红唇为你迷，<br />
							痴情的眼神为你恋，<br />
							火热的心儿为你跳，<br />
							真情的花儿对你说:520我爱你，<br />
							<br />

							一句我想你，泪水已夺眶而出;<br />
							情不移，爱不变，到永久!<br />
							一句我陪你,<br />
							温暖在心里蔓延;<br />
							一句我爱你，热情的火山在喷发。<br />
							520我爱你，我愿意伴你一生一世也不悔!<br />
						</p>
						<p class="author">
							- WLZ
						</p>
					</div>	
				</div>
			</div>
		</div>
	</body>
</html>

荔枝科研社

关注

6
点赞
踩
38

收藏

觉得还不错? 一键收藏
打赏
1
评论
520最深情的表白信（代码实现）

目录1 视觉化2 520最深情的表白信（代码展现）2.1 准备2.2 深情的信展现2.3 代码1 视觉化想想那些发明家和他们发明的东西:莱特兄弟和飞机、伊斯曼和电影、爱迪生和灯泡、贝尔和电话。任何被发明或创造出来的东西,都是先源于发明者在心中见到一个景象，这是唯一的方法。他清楚地看见它，然后借由他在内心持续保有那个“成品”的画面，宇宙的力量就通过他，把这成品带来这个世界。这些人都知道这个秘密，他们对无形的事物具有完全的信心，他们明白自己具有撑起宇宙的力量，能把所要发.
复制链接

扫一扫