UC知道用css定义图片边框的问题.
来源：百度知道 编辑：UC知道 时间：2024/05/29 06:03:15
各位大侠,大家好,我是一个学生,是个菜鸟,希望大家能帮助我,小弟在这里先谢谢大家了.
我是在修改自己的博客的模板,我的博客是http://lovehuang.com
博客程序用的是sablog-x(用的人不是很多,模板很少.)
我自己想修改下文章页面的图片显示效果.
我要的效果是:给图片加一个边框,当鼠标移动到图片上的时候,边框颜色为红色,当鼠标移开后,边框颜色为黄色..
我已经在css里面定义了图片的边框,css如下
img.framed {
padding: 6px;
border: 2px solid #FFCC66;
background-color: #FFF;
}
可是这样只能使图片有个边框,不能实现鼠标移上去与移开的效果..
有人告诉我用下面的css来做
img {
border:1px solid #fc6;
}
img:hover {
border:1px solid #f00;
}
我用了之后,整个博客里面全部的图片都变成加边框的了.
而我要的效果是只有我那个修改的页面(show.htm)所显示的图片有这效果.
还有朋友告诉我用js来搞定,他给我的代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
我是在修改自己的博客的模板,我的博客是http://lovehuang.com
博客程序用的是sablog-x(用的人不是很多,模板很少.)
我自己想修改下文章页面的图片显示效果.
我要的效果是:给图片加一个边框,当鼠标移动到图片上的时候,边框颜色为红色,当鼠标移开后,边框颜色为黄色..
我已经在css里面定义了图片的边框,css如下
img.framed {
padding: 6px;
border: 2px solid #FFCC66;
background-color: #FFF;
}
可是这样只能使图片有个边框,不能实现鼠标移上去与移开的效果..
有人告诉我用下面的css来做
img {
border:1px solid #fc6;
}
img:hover {
border:1px solid #f00;
}
我用了之后,整个博客里面全部的图片都变成加边框的了.
而我要的效果是只有我那个修改的页面(show.htm)所显示的图片有这效果.
还有朋友告诉我用js来搞定,他给我的代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
呵呵，我也是湖南的，现在在长沙。。
我用的是bo-blog
sablog还参考了bo-blog的说。。
我想了一下 你如果只对那篇文章的图片实现那个效果的话
可以用iframe
http://hi.baidu.com/y888/blog/item/d7ecb27ecf8643380dd7da61.html