CSS3模拟白云飘动水中船效果
今天给大家介绍一款CSS3实现的水中漂船的效果，乍一看像flash动画做的，其实呢？是我们强大的CSS3哇
模拟船动的效果，水中波浪的效果，云彩同样也能实现飘动效果，截图如下：
部分代码：
<div class="container">
<header>
<h1>Animated Web Banners With CSS3</h1>
<h2>Exploring ways to spice up our web banners with CSS3 animations.</h2>
<p class="codrops-demos">
<a class="current-demo" href="index.html">Horizontal</a>
<a href="index2.html">Vertical</a>
</p>
</header>
<section class="wrapper">
<div id="ad-1">
<div id="content">
<h2>Lost at sea?</h2>
<h3>Relax - we've got your rudder.</h3>
<form>
<input type="text" id="email" value="Email address..." />
<input type="submit" id="submit" value="Guide me" />
</form>
</div>
<div id="clouds">
<ul id="cloud-group-1">
<li class="cloud-1"></li>
<li class="cloud-2"></li>
<li class="cloud-3"></li>
</ul>
<ul id="cloud-group-2">
<li class="cloud-1"></li>
<li class="cloud-2"></li>
<li class="cloud-3"></li>
</ul>
</div>
<ul id="boat">
<li>
<div id="question-mark"></div>
</li>
</ul>
<ul id="water">
<li id="water-back"></li>
<li id="water-front"></li>
</ul>
</div>
</section>
</div>
