您好,登錄后才能下訂單哦!
html中的display:none代表什么?可能很多人都不太了解,為了讓大家更加了解,小編給大家總結了以下內容,希望大家根據這篇文章可以有所收獲。
display:none的意思:
隱藏元素并脫離文檔,流就是隱藏該區域,不占實際空間,但對后臺來說真實存在,可以獲取被隱藏的元素簡單的來說就是將元素設置為none的時候既不會占據空間,也無法顯示,相當于該元素不存在。
看完了display none的意思后,我們就接著來看一下display none的用法。
<html> <head> <title></title> <style type="text/css"> div{ background: lightblue; width: 200px; height: 200px; } span{ background: pink; display: none; } </style> </head> <body > <div><span>需要隱藏的區域</span></div> </body> </html>
設置了display:none屬性值,則就變成了如下圖所示的效果:需要隱藏的區域就被隱藏了。
display屬性還有其他元素:
值 | 描述 |
---|---|
none | 此元素不會被顯示。 |
block | 此元素將顯示為塊級元素,此元素前后會帶有換行符。 |
inline | 默認。此元素會被顯示為內聯元素,元素前后沒有換行符。 |
inline-block | 行內塊元素。(CSS2.1 新增的值) |
list-item | 此元素會作為列表顯示。 |
run-in | 此元素會根據上下文作為塊級元素或內聯元素顯示。 |
compact | CSS 中有值 compact,不過由于缺乏廣泛支持,已經從 CSS2.1 中刪除。 |
marker | CSS 中有值 marker,不過由于缺乏廣泛支持,已經從 CSS2.1 中刪除。 |
table | 此元素會作為塊級表格來顯示(類似 <table>),表格前后帶有換行符。 |
inline-table | 此元素會作為內聯表格來顯示(類似 <table>),表格前后沒有換行符。 |
table-row-group | 此元素會作為一個或多個行的分組來顯示(類似 <tbody>)。 |
table-header-group | 此元素會作為一個或多個行的分組來顯示(類似 <thead>)。 |
table-footer-group | 此元素會作為一個或多個行的分組來顯示(類似 <tfoot>)。 |
table-row | 此元素會作為一個表格行顯示(類似 <tr>)。 |
table-column-group | 此元素會作為一個或多個列的分組來顯示(類似 <colgroup>)。 |
table-column | 此元素會作為一個單元格列顯示(類似 <col>) |
table-cell | 此元素會作為一個表格單元格顯示(類似 <td> 和 <th>) |
table-caption | 此元素會作為一個表格標題顯示(類似 <caption>) |
inherit | 規定應該從父元素繼承 display 屬性的值。 |
看完上述內容,你們對html中的display:none有進一步的了解嗎?如果還想了解更多相關內容,歡迎關注億速云行業資訊頻道,感謝各位的閱讀。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。