百度空间怎么做下雨的特效。CSS编辑的那种。

html-css016

百度空间怎么做下雨的特效。CSS编辑的那种。,第1张

楼主你好,很高兴为您解答!

如果您想要将下雨的图片放在空间头部图片位置,就在头部图片代码中加入此代码

/*标题栏*/

#header{height:508pxbackground:url(图片地址) no-repeat}这是模板头部图片

#header DIV.lc {}头部图片左边图片

#header div.rc{BACKGROUND: url(图片地址) repeat:} 头部图片右边图片

在这里的一左一右插入下雨的图片都可以

如果你是要在模板背景插入图片,这一句就可以了

body{background:url(图片地址) repeat}

#header DIV.lc {BACKGROUND: url(http://imgsrc.baidu.com/css/pic/item/be6cdbe748b79637b8382065.jpg) repeatleft:1pxwidth:950pxline-height:110pxfilter:Alpha(opacity=40)}/*雨点动画*/------------------------------------------请把以上话,加入css中,保存并使用就可以了~图片任意更换,这是下雨的图片:http://imgsrc.baidu.com/css/pic/item/be6cdbe748b79637b8382065.jpg下雪的图片:

下花的图片:

如有疑问请留言,或加hi~

这是一款非常有意思的纯CSS3扁平风格天气预报卡片动画特效。该天气预报特效将各种天气制作为卡片形式,包括下雨,闪电,白天,夜间和下雪。卡片使用扁平化风格,并使用CSS3帧动画来制作各种动画效果。

制作方法

HTML结构

该特效的HTML结构采用无序列表的HTML结构,其中每一个li.card元素代表一种卡片。

<ul class="card-list">

<li class="card">

<div class="card-color color-rain">

<div class="rain"></div>

</div>

<div class="card-info">

<p>63 ℉</p>

<p>low of 61 ℉</p>

</div>

</li>

......

</ul>

复制代码

CSS样式

首先给卡片一些基本样式。

.card {