如何使图片边框虚化?

html-css08

如何使图片边框虚化?,第1张

实现的方法和详细的操作步骤如下:

1、首先,打开要处理的文档,如下图所示。

2、其次,双击文档中的图片,此图片的初始状态如下。

3、接着,双击图片后,在界面右侧出现设置图片格式的窗口,展开“柔化边缘”选项,将大小根据实际情况要求进行设置,如下图所示。

4、最后,设置柔化边缘后,就达到了边框虚化的效果了,如下图所示。这样,以上的问题就解决了。

背景图片虚化主要依靠的是 filter: blur(15px) 这个css属性 blur值 越大 模糊程度也越大 最终我们希望的效果图是这样的 实现方式: 第一步 一个大的 div 里面包裹两个 小的 div1 和 div2 第二步 div1元素加入背景、宽高、过滤(filter)、浮动 第三步 div2元素 开启定位 absolute(一定要脱离普通文档流) 现在基本的效果就实现了,想让页面更美观 剩下的就要自己动手喽 关键点就是 filter属性 :让图片模糊 脱离普通文档流 :内容放到模糊div1 的上面

首先你这个原图上不能有边框,因为css是不能改变图片的本身属性的

然后在页面中插入图片之后,再定义图片的边框例如 img{border:#000 solid 1px}

光标划过img:hover{border:#000 dooted 1px}

但是IE6是不支持除a标签之外的元素的hover事件的,尽量用js