首頁 > web前端 > css教學 > css中的關於empty-cells的問題

css中的關於empty-cells的問題

黄舟
發布: 2017-06-30 13:25:48
原創
1581 人瀏覽過

發現在css中,當把border-collapse設定為separate為,要不要empty-cells結果是一樣的,而且用show與hide值都一樣,望各位指點。

在css2標準中
語法:

empty-cells : show | hide
登入後複製

取值:
show  :  預設值。顯示邊框
hide  :  隱藏邊框

說明:
設定或擷取當表格的儲存格無內容時,是否顯示該儲存格的邊框。
只有當表格行和列的邊框獨立(例如當 border-collapse 屬性等於 separate )時此屬性才會起作用。
對應的腳本特性為 emptyCells 。

這是個css2的標準不為IE所支持,在Firefox中可以正常顯示效果,具體效果的演示代碼如下

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>table test</title>
<style>
#layout {}
.show {border: 1px solid #ff0000; border-collapse:separate; empty-cells: show;}
.hide {border: 1px solid #ff0000; border-collapse:separate; empty-cells: hide;}
</style>
</head>

<body>
<table id="layout">
  <tr>
    <td class="show">Cascading</td>
    <td class="show"></td>
  </tr>
  <tr>
    <td class="hide">Cascading</td>
    <td class="hide"></td>
  </tr>
 </table>
</body>
</html>
登入後複製

可以看到show的時候空表格被顯示出來,hide的時候空表格被隱藏

以上是css中的關於empty-cells的問題的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
css
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板