慕名而来,请教各位大侠一个关于css图片边框的问题.
我用css定义了图片的边框
img.framed {
padding: 6px;
border: 1px solid #FFCC66;
background-color: #FFF;
}
我要的效果是当鼠标移动到图片上时,图片的边框就变色成红色,鼠标移开时,又变回默认定义#FFCC66;色,请问要怎么做?
谢谢.
2006-10-11, 19:57
|
#3 (页面定位) |
|
戏子
 
注册日期: 2006-03-09
住址: China
帖子: 893
  |
img是不具备hover伪类的,可以用js实现
代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<title>Untitled Document</title>
<style>
img {
padding: 6px;
border:1px solid #fc6;
background-color: #FFF;
}
</style>
<script type="text/javascript">
function imgchange(){
var img=document.getElementsByTagName('img');
var img_l=img.length;
for(var i=0;i<img_l;i++){
if(img[i].ref=="change"){
img[i].onmouseover=function(){
this.style.border="1px solid #f00";
}
img[i].onmouseout=function(){
this.style.border="1px solid #fc6";
}
}
}
}
window.onload=function(){
imgchange();
}
</script>
</head>
<body>
<img src="http://bbs.chinahtml.com/images/misc/vbulletin3_logo_white.gif" ref="change" />
</body>
</html>
|
|
|
平板模式
