目录
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>
