Home  >  Article  >  Web Front-end  >  How to show and hide divs

How to show and hide divs

迷茫
迷茫Original
2017-03-25 10:16:543155browse

visibilityHidden objects also retain the physical space occupied by the object when it is displayed, while display does not retain it. You can save the following code to see the effect:
Specific steps:
Code example:

<p style="border:1px solid #000;background:#eee">
<span style="width:200;height:200;visibility:hidden"></span>

←Object whose SS attribute is visibility:hidden

</p><br>
<p style="border:1px solid #000;background:#666">
<span style="width:200;height:200;display:none"></span>

←Objects whose SS attribute is display:none
94b3e26ee717c64999d7867364b1b4a3

Special Tips
Use the visibility attribute to control the hidden object and still occupy the position when it is displayed, but the display does not.

Special Note

The display attribute sets the display mode of the element. The corresponding script feature is display. The optional values ​​are none, block and inline. The description of each value is as follows:
none Hidden element , does not preserve the space when the element is displayed.
Display elements in block mode.
inline Displays elements inline.
inline-block objects appear as inline elements, but all child objects appear as block elements. Adjacent inline elements will appear on the same line, spaces are allowed.
list-item displays block elements as list objects and can add item punctuation. (Requires IE6.0+ support)
table-header-group displays the element as a table header group, equivalent to the tHead element.
table-footer-group displays the element as a table footer group, equivalent to the tFoot element.
The visibility attribute sets whether to display the element. The corresponding script feature is visibility. The optional values ​​are inherit, hidden and visible. The description of each value is as follows:
inherit inherits the visibility attribute setting of the parent element.
hidden Hides the element but retains the space it occupies.
visible Display element (default value).

The above is the detailed content of How to show and hide divs. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn