Question

我想创建2个以sprite-img为背景的按钮。但是图像没有显示。

也许会干扰网格的背景CSS？

文档结构如下：

<body>
  <div class="container">     // this has a background color that seems not to affect 
    <div class="row">         // this has no background
      <div class="column">    // this has a background color that seems to affect
        <div class="wrapper-for-buttons">  // here are the divs for th background image
         <div class="I-want-a-BG-image">   // here shall the background image go

我尝试过的方法：我已经在同一HTML页面中检查了图像URL。这可行。我已经检查了HTML代码和另一个（干净的）HTML文档中的CSS。这也可以。

对于不同的列，我有一个非常具体的选择器，因为它们会更改其他页面上的背景颜色。但是：我已经检查了div的选择器，该选择器将在同一HTML页面中制作“ border”和“ background-color”来获取背景图像。这行得通。

所以我不知道在哪里搜索了…… 任何提示都非常感谢。在此先感谢

CSS

.container {
  display: block;
  width: 95%;
  margin-left:auto;
  margin-right: auto;
  background-color: #0F0;
}
/* Does this selector make trouble? */
[class|="col"] {
  float: left;
   min-height: 1px;
   background-color: #F0F;
}

#testImage {
display: block;
position: relative;
float:left;
width: 200px;
height: 200px;
background: url("./src/img/contact/mailphone.png") 0 0;
border: 5px solid green;
}

HTML

   <address id="imprint">
      <div class="container">
        <div class="row clearfix">
          <div class="col-70">
            <p>this col is not of interest</p>
          </div>
          <div class="col-30">
            <div class="mailphonewrapper">
              <div id="testImage"></div>
            </div>
          </div>
        </div>
      </div>
    </address>

没有显示背景图片，链接正常，选择器正常，我没有意识到任何干扰吗？

0 个答案: