HTML白云飄動效果特效代碼：
<html>
<head>
<style type="text/css">
.background {
position:absolute;
top:0px;
left:0px;
height:100%;
width:100%;
z-index:-1;
}
.cloud {
position:absolute;
top:150px;
left:-150px;
width:150px;
height:105px;
background-image:url('cloud.png');
-webkit-animation: moveclouds 15s linear infinite;
-moz-animation: moveclouds 15s linear infinite;
-o-animation: moveclouds 15s linear infinite;
}
.cloud2 {
position:absolute;
top:102px;
left:-150px;
width:150px;
height:105px;
background-image:url('cloud.png');
-webkit-animation: moveclouds 20s linear infinite;
-moz-animation: moveclouds 20s linear infinite;
-o-animation: moveclouds 20s linear infinite;
}
@-webkit-keyframes moveclouds {
0% {left:-150px;}
100% {left:110%;}
}
@-moz-keyframes moveclouds {
0% {left:-150px;}
100% {left:110%;}
}
@-o-keyframes moveclouds {
0% {left:-150px}
100% {left:110%;}
}
</style>
</head>
<body>
<div class="background"></div>
<div class="cloud"></div>
<div class="cloud2"></div>
</body>
</html>使用以上樣式和動畫代碼，您可以在網頁上添加漂浮的白云和動態的風景視覺效果。您只需要將圖片和樣式放在適當的位置，然后將類名添加到相應的元素中即可。啟用動畫效果的方法有多種，這里我們使用了CSS3的@keyframes和animation屬性。