Home  >  Article  >  Web Front-end  >  How to use display to show hidden elements in css

How to use display to show hidden elements in css

青灯夜游
青灯夜游Original
2021-04-28 18:21:477105browse

How to use display to display hidden elements in css: 1. Set the "display:none;" style to the element to hide the element; 2. Set the "display:block;" style to the element to hide the element display.

How to use display to show hidden elements in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

css display attribute

The display attribute specifies the type of box that the element should generate. Settings:

  • display: none; Hidden objects

  • display: block;Except conversion In addition to block-level elements, it also means display elements

Instructions:

Usedisplay: none;can not be occupied Spatial, hiding the element, so dynamically changing this attribute will cause rearrangement (change the page layout), which can be understood as deleting the element on the page; it will not be inherited by descendants, but its descendants will not be displayed. , after all, they were all hidden together.

Example:



    
        
        元素隐藏--display:none
        
    
正常显示元素
隐藏元素
正常显示元素

Rendering:

How to use display to show hidden elements in css

(Learning video sharing: css video tutorial )

The above is the detailed content of How to use display to show hidden elements in css. 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