图片如何加框

    这个效果挺好看的,其实是校内上相册的效果,有同学问,就简单写一下,挺简单的。如果变化模板的话还得再改一次……

    比如这个Simple White风格,在Skin 目录下找到这个文件夹,其下又个layout.css,找到如下这么一行

CSS代码
  1. /*—日志内容框–*/  
  2.   .Content-body img {background-colorimportant;border1px solid #FFFFFFmargin0pxpadding3px;} 

将其替换为如下代码即可实现现在的SourBell上的效果了:

CSS代码
  1. /*—日志内容框–*/   
  2. .Content-body img {border:1px solid #006699;margin:0px; padding:3px;background:#FFFFFF;}  
  3. .Content-body a:hover img { border:1px solid #FD0085; background:#FFFFFF;} 

    其中,第2行的border属性中的#006699为常规状态下边框颜色,为了统一风格我设置为simple white的默认字体颜色。同理,第3行里border属性中的#FD0085就是simple white中超链接的粉色,两个background好像影响不大,这些都可以自己修改,嗯哼。

    这样的效果必须图片有超链,如果没有,那只有一个外框,鼠标移上去没有变化。另外好像在IE下显示跟FF下又点区别,我在FF下显示是正常的,IE很少用,所以也懒得去管了。