Question

我试图显示背景图片，但没有成功。我不知道我的代码有什么问题。

＆＃13;

 .comparison .product {
  background-image: url('/static/img/neotic_payment.png') no-repeat 95% center;
  background: #3d5c5c;
  height: 40px;
  font-size: 1.6em;
  background-size: contain;
}

＆＃13;

<div class="comparison">
  <table>
    <thead>
      <tr>
        <th class="product"></th>
        <th class="product">Starter</th>
        <th class="product">Standard</th>
        <th class="product">Super</th>
        <th class="product" style="-webkit-box-shadow: 0 0 25px #4eba7b;
        -moz-box-shadow: 0 0 25px #4eba7b;
        -ms-box-shadow: 0 0 25px #4eba7b;
        -o-box-shadow: 0 0 25px #4eba7b;
        box-shadow: 0 0 25px #4eba7b;  z-index: 100;">Ultimate</th> 
      </tr>
    </thead>
  </table>
</div>

＆＃13;

Answer 1

您已经同时提到了背景图片，背景标签。您的背景颜色正在工作，图像没有。试试这个用图像显示颜色：

background: url('image-path') no-repeat 95% #3d5c5c;

Working Demo

Answer 2

您的css中存在语法错误。背景图像在“95％”后没有分号，“中心”有2个分号。

 .comparison .product {
background-image: url('/static/img/neotic_payment.png') no-repeat 95%; 
background: #3d5c5c;
height: 40px;
font-size: 1.6em;
background-image: contain;
}

Answer 3

请将css替换为css

.comparison .product {
    background-image: url('/static/img/neotic_payment.png');
    background: #3d5c5c;
    height: 40px;
    font-size: 1.6em;
    background-size:contain;
    background-repeat: no-repeat;
    background-position: center; 
 }

无法显示背景图片

3 个答案: