如何使用css隐藏图像外的背景？

Question

如何使用css隐藏图像外的背景？

测试我的代码时。它会像这样展示

但我想将我的代码应用于此类

我该怎么办？

＆＃13;

＆＃13;

.plainmodal-close{
     position: absolute;
    width: 45px;
    height: 45px;
    right: 50%;
    top: 0px;
    background: url(http://www.entypo.com/images/circle-with-cross.svg) no-repeat;
    background-color: red;
    border-radius: 50%;
    border: 3px solid green;
    }

＆＃13;

<div class="plainmodal-close"></div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

由于无法通过css修改图像，因此无法按照您想要的方式进行操作。您可以为托管图像的容器添加一些样式，但就此而言。

但是，更好的方法是使用font-awesome之类的网络字体并使用css来获取它的喜好。

＆＃13;

＆＃13;

.fa-stack .fa.fa-times 
{ 
  color: red; 
  border-radius: 50%;
  background-color: white;
  border: 3px solid green;
}

.fa-stack .fa.fa-circle 
{ 
  opacity:0.0;  
  color: red;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>

<span class="fa-stack fa-lg">
  <i class="fa fa-circle fa-stack-2x"></i>
  <i class="fa fa-times fa-stack-1x fa-inverse"></i>
</span>

＆＃13;

＆＃13;

＆＃13;

Answer 2

因为盒子阴影很有趣：

.plainmodal-close{
  position: absolute;
  width: 45px;
  height: 45px;
  right: 50%;
  top: 0px;
  background: url(http://www.entypo.com/images/circle-with-cross.svg) no-repeat center center;
  background-color: red;
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px green;
}

<div class="plainmodal-close"></div>

Answer 3

.plainmodal-close{
    position: absolute;
    width: 45px;
    height: 45px;
    right: 50%;
    top: 0px;
    border-radius: 50%;
    border: 3px solid green;
    box-sizing:
}
.plainmodal-close > span{
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
    margin: auto;
    width: 30px;
    height: 7px;
    background-color: red;
    transform: rotate(45deg);
}
.plainmodal-close > span::after{
    content: '';
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0;
    margin: auto;
    width: 30px;
    height: 7px;
    background-color: red;
    transform: rotate(90deg);
}

<div class="plainmodal-close">
  <span></span>
</div>

这个怎么样？

我想推荐使用PURE CSS。

我无法提出答案。

我可以提出另一种选择。