jquery - 使用 LESS 不影响子元素的 CSS 背景透明度

Question

我在 Internet 和 Stackoverflow 上找到了很多解决方案并进行了尝试，但都无法解决我的问题。我在我的网站上使用 FontAwesome 和 LESS，但是当我添加字体图标时，它会受到父元素的不透明度 (rgba) 的影响。这是我的代码:

http://codepen.io/thehung1724/pen/Lxjcl

希望有人能帮帮我。提前致谢。

Answer 1

去掉前面的!!!在你的代码笔中，我删除了之前的样式并将样式应用于图标容器。然后 parent 的背景颜色保持透明，图标不! :)

  .icon-container{

  &:before{
    width: 50px;
    height: 50px;
    position: absolute;
    content: "";
    left: 8px;
    top: 5px;
    .rotate(45deg);
    .rgba(black, 0.4);
    z-index:1;
  }

  span{
    position:relative;
    display:block;
    z-index:2;
  }


  &:nth-child(n){
    filter: none;
  }