使用CSS将背景颜色/图像应用到跨度

Question

我具有以下类型的HTML结构，并且只想使用CSS在跨度上应用CSS。

<table>
<tr>
<td>
 <table>
  <tr>
   <td>
     <img src="/test/test.png">
   </td>
  </tr>
 </table>
  <input type="hidden">
<span>
</span>
<span>
</span>
</td>

</tr>
</table>

I am trying below CSS but it is not applying any color.

img[src *="/test/test.png"] +span {
background-color:Red;

}

我只想借助特定的图像标签将背景颜色/图像应用到第一个跨度。

Answer 1

尝试此代码。希望这对您有用

td img {
    height: 250px;
    width: 600px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

span:nth-child(3)  {
    border: 5px solid;
    height: 250px;
    width: 500px;
    display: inline-block;
    background: #f00;
}
span:nth-child(4) {
    height: 250px;
    width: 500px;
  display:inline-block;
    background-image: url(https://i.ibb.co/W2tYdfv/88.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

<table>
<tr>
<td>
 <table>
  <tr>
   <td>
     <img src="https://i.ibb.co/k8N4R4Z/66.jpg">
   </td>
  </tr>
 </table>
  <input type="hidden">
<span>
</span>
<span>
</span>
</td>
</tr>
</table>