css3 - 如何使用CSS实现图片内边缘模糊效果？

Question

{代码...} 代码大概是这样的，DIV层实现了一个圆形，因此无论下面的图片是什么大小的，都只显示一个圆形的大小，就像很多网站上看到的圆形头像那样。 现在想要在图片内添加和背景颜色一致的带透明效果的内阴影，...

巴扎黑 · Answer

css.cover {
    border-radius: 50%;
    width: 180px;
    height: 180px;
    overflow: hidden;

    position:relative;
}
.cover:after{
  position:absolute;
  content:'';
  width:100%;
  height:100%;
  top:0;
  left:0;
  border-radius:50%;
  box-shadow:0 0 30px 10px rgba(255,255,255,.7) inset;
}

天蓬老师 · Answer

虽然问题比较久了，还是来答一下。刚学习前端，请多指教！


    
        <--!      -->

.cover {
            border-radius: 50%;
            width: 180px;
            height: 180px;
            overflow: hidden;
            background: url('images/bg.jpg');
            box-shadow:0 0 30px 10px rgba(255,255,255,.7) inset;
        }