html - 在对象上添加背景

Question

我试图了解我做错了什么。我正在使用这段代码

<div style="background-image: url('http://www.ionianradio.gr/radio1/images/tv5.png');" 
     align="center">
    <object id="livestreamPlayer" style="visibility: visible;"   
      data="http://cdn.livestream.com/chromelessPlayer/v20/playerapi.swf?channel=ionianradio&amp;color=0x000000&amp;autoPlay=false&amp;mute=false&amp;iconColorOver=0xe7e7e7&amp;iconColor=0xcccccc" 
      type="application/x-shockwave-flash" width="950" height="500">
    </object>
    <div>

不幸的是，我只看到了物体而没有看到背景。不过，我不太确定我是否能做到这一点。背景是电视监视器，对象是直播节目。

Answer 1

您需要在 div 中指定 height 才能显示背景。

下面的片段:

div {
  background-image: url('http://www.ionianradio.gr/radio1/images/tv5.png');
  height: 600px /*whatever you like*/
}

<div align="center">
  <object id="livestreamPlayer" style="visibility: visible;" data="http://cdn.livestream.com/chromelessPlayer/v20/playerapi.swf?channel=ionianradio&amp;color=0x000000&amp;autoPlay=false&amp;mute=false&amp;iconColorOver=0xe7e7e7&amp;iconColor=0xcccccc" type="application/x-shockwave-flash"
  width="950" height="500"></object>
</div>

注意事项:

• 尽量不要使用内联 CSS，因为它是 not a good practice , 而不是使用 classes 或 ID's
• 您正在使用 align=center，尽量避免使用它，因为它是 deprecated ，相反，您可以分配一个 class/ID 并使用 CSS 使其与您需要/想要的内容对齐。