如何摆脱底部再次出现的背景图像?

时间:2016-04-08 14:59:04

标签: html css

我不知道如何摆脱再次出现的背景图像,猜测它与&:之前有关,我希望你能帮助我。 Thx提前。

http://codepen.io/ctrprt253/pen/qZVKKG

.bg-image{
  background: $color-primary;
  text-align: center;
  position: relative;
  z-index: 1;
  overflow: hidden;
  //text-shadow: 2px 0 5px black;

  &:before{
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: #333     url('https://1.bp.blogspot.com/-6E1qWDwgvPE/UW1IxACizzI/AAAAAAAAAOc/5COs8aubq4c/s1600/the_art_of_conversation_by_rttmsdag-d32q8oc.jpg') no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
    filter: blur(5px);
    opacity: .8;
    transform: scale(0.8);
  }

1 个答案:

答案 0 :(得分:0)

更改此行:

background: #333     url('https://1.bp.blogspot.com/-6E1qWDwgvPE/UW1IxACizzI/AAAAAAAAAOc/5COs8aubq4c/s1600/the_art_of_conversation_by_rttmsdag-d32q8oc.jpg') no-repeat top center;

由此:

background: #333;

你可以删除这些行:

background-size: cover;
background-attachment: fixed;

See it here