css如何隱藏表格

醉折花枝作酒筹原創: 2021-04-21 14:27:322514瀏覽

在css中，可以使用display屬性隱藏表格，只需要給tr元素設定「display:none」樣式即可。 display屬性用於定義建立佈局時元素產生的顯示框類型，當值為none時，表示該元素不會被顯示，並且脫離文件流，不佔實際空間。

css如何隱藏表格

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

新建一個html文件，命名為test.html，在test.html檔案內，使用table標籤建立一個三行兩列的表格。

在test.html檔案內，設定第二行的id屬性為mytarget，下面使用css將它隱藏。

<body>
    <table border="1">
        <tr>
            <td>19999</td>
            <td>19999</td>
        </tr>
        <tr id="mytarget">
            <td>19999</td>
            <td>19999</td>
        </tr>
        <tr>
            <td>19999</td>
            <td>19999</td>
        </tr>
    </table>
</body>

在css標籤內，透過table設定表格的寬度為280px，高度為180px。透過id設定表格第二行的樣式，將display屬性設為none，實作將它隱藏。

<style>
table{
    width: 280px;
    height: 180px;
}
#mytarget{
    display:none;
}
</style>

在瀏覽器開啟test.html文件，查看實現的效果。

css如何隱藏表格

推薦學習：css影片教學

以上是css如何隱藏表格的詳細內容。更多資訊請關注PHP中文網其他相關文章！

html5 css css3 html display table tr

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：css怎麼給表格設定邊框下一篇：css怎麼給表格設定邊框

看更多