代码简介：

这是个很常见的图片显示特效，当鼠标经过图片的时候，图片上浮动一个半透明的层，层内显示文字，同时图片边框变亮，视觉效果相当好。

代码内容：

<

html

>

<

head

>

<

title

>

鼠标滑过图片显示半透明文字，边框变色代码_网页代码站(www.webdm.cn)

</

title

>

<

style 

type

="text/css"

>

body

{

background

:

#333

}

img

{

border

:

none

}

.wrap

{

margin

:

10px

;

position

:

relative

;

}

.photo a

{

position

:

absolute

;

display

:

block

;

border

:

1px solid #999

;

padding

:

2px

}

.photo a:hover

{

border

:

1px solid #fff

;

text-decoration

:

none

}

.photo a span 

{

display

:

none

;

cursor

:

hand

;

text-align

:

center

;

font

:

bold 12px/30px Verdana, Arial

;

}

.photo a:hover span

{

width

:

500px

;

margin

:

0 2px

;

background

:

#000

;

display

:

block

;

position

:

absolute

;

bottom

:

0

;

left

:

0

;

color

:

#fff

;

filter

:

alpha(opacity=60)

;

-moz-

opacity

:

0.6

;

opacity

:

0.6

;

}

</

style

>

</

head

>

<

body

>

<

div 

class

="wrap"

>

<

div 

class

="photo"

><

a 

href

="#"

>

<

img 

src

="http://www.webdm.cn/images/wall5.jpg"

 border

="0"

 alt

=""

/><

span

>

英国巨石阵，一直以来都是一个谜，现在它是一处著名的旅游景点。

</

span

></

a

></

div

>

</

div

>

</

body

>

</

html

>

<

br 

/>

<

p

><

a 

href

="http://www.webdm.cn"

>

网页代码站

</

a

>

 - 最专业的网页代码下载网站 - 致力为中国站长提供有质量的网页代码！

</

p

>

代码来自：http://www.webdm.cn/webcode/08019f9f-65ee-4426-8e54-795c955fc72d.html