爲什麼不顯示錶格背景？

我有一張表，我試圖應用背景圖片，但沒有顯示。圖片的路徑是正確的（螢火蟲說圖像加載）和表的大小是一樣的圖像尺寸（156X46px）爲什麼不顯示錶格背景？

HTML：

<!--hazard icons start here --> 
       <table class="hazard-table"> 
       <tr> 
        <td> 1 </td> 
        <td> 1 </td> 
        <td> 1 </td> 

       </tr> 
       <tr> 
        <td> 1 </td> 
        <td> 1 </td> 
        <td> 1 </td> 

       </tr> 


       <!-- hazard icons end here --> 
       </table>

CSS：

table.hazard-table { 
    background:url('../images/icon-item.png') no-repeat; 
    width:156px; 
    height:46px; 
    border-width: 1px; 
    border-spacing: 2px; 
    border-style: solid; 
    border-color:#ebebeb; 
    border-collapse: collapse; 
    background-color: white; 
} 
table.hazard-table th { 
    border-width: 1px; 
    padding: 1px; 
    border-style: inset; 
    border-color: #ebebeb; 
    background-color: white; 
    -moz-border-radius: ; 
} 
table.hazard-table td { 
    background-position:30 20 ; 
    border-width: 1px; 
    padding: 1px; 
    border-style: inset; 
    border-color: #ebebeb; 
    background-color: white; 
    -moz-border-radius: ; 
}

來源

2013-07-08 Aneesh

table.hazard-table { 
    background:url('../images/icon-item.png') no-repeat; 
    width:156px; 
    height:46px; 
    border-width: 1px; 
    border-spacing: 2px; 
    border-style: solid; 
    border-color:#ebebeb; 
    border-collapse: collapse; 
    background-color: white; 
}

此：

background-color: white;

倍率與白色背景圖像。你應該這樣做，而不是：

table.hazard-table { 
     background:white url('../images/icon-item.png') no-repeat; 
     width:156px; 
     height:46px; 
     border-width: 1px; 
     border-spacing: 2px; 
     border-style: solid; 
     border-color:#ebebeb; 
     border-collapse: collapse; 
}

編輯：

試試這個：

table{ 
.hazard-table { 
    background:white url("../images/icon-item.png") no-repeat; 
    width:156px; 
    height:46px; 
    border-width: 1px; 
    border-spacing: 2px; 
    border-style: solid; 
    border-color:#ebebeb; 
    border-collapse: collapse; 


    th{ 
     border-width: 1px; 
     padding: 1px; 
     border-style: inset; 
     border-color: #ebebeb; 
     background-color: white; 
     -moz-border-radius: ; 
     } 

     td{ 
      background-position:30 20 ; 
      border-width: 1px; 
      padding: 1px; 
      border-style: inset; 
      border-color: #ebebeb; 
      background-color: white; 
      -moz-border-radius: ; 
     } 
}

來源

2013-07-08 07:06:29 isThisLove

Woops。我完全錯過了背景顏色：白色;不錯的工作:) – zuc0001

我改變了你說的，它仍然無法正常工作。 – Aneesh

嘗試['code'] background-image：url（'../ images/icon-item.png'）;背景重複：無重複;背景顏色：#fff; ['code'] – zuc0001

} 
table.hazard-table td { 
    background-position:30 20 ;

作爲起始者，背景位置必須是像素或「中心」等。

} 
table.hazard-table td { 
    background-position:30px 20px ;

這個「可能」解決了這個問題。

來源

2013-07-08 07:05:16 zuc0001

謝謝，但它沒有解決它。 – Aneesh

希望這fiddle鏈接會爲你工作。

table.hazard-table { 
    /* background:url('../images/icon-item.png') no-repeat 0 0;*/ 
    background:url('http://img.talkandroid.com/uploads/2013/03/wpid-photo-jan-14-2013-1115-am.jpg') no-repeat 0 -550px; 
    width:156px; 
    height:46px; 
    border-width: 1px; 
    border-spacing: 2px; 
    border-style: solid; 
    border-color:#ebebeb; 
    border-collapse: collapse; 
    /* background-color: white;*/ 
} 
table.hazard-table th { 
    border-width: 1px; 
    padding: 1px; 
    border-style: inset; 
    border-color: #ebebeb; 
    background-color: white; 
    -moz-border-radius: ; 
} 
table.hazard-table td { 
    background-position:30 20 ; 
    border-width: 1px; 
    padding: 1px; 
    border-style: inset; 
    border-color: #ebebeb; 
    /* background-color: white;*/ 
    -moz-border-radius: ; 
}

來源

2013-07-08 07:13:27

爲什麼不顯示錶格背景？

回答

相關問題