How to hide elements but retain position in css

In CSS, you can use the visibility attribute to hide elements but retain the element position. You only need to set the "visibility: hidden;" style to the element; in this way, the element will be hidden, but will not disappear and still occupy the Space, the original HTML style will not be changed after hiding.

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

css hides elements but retains position

      
  
正常显示元素
 
隐藏元素
 
正常显示元素
  

Rendering:

The visibility attribute specifies whether the element is visible.

This attribute specifies whether to display the element box generated by an element. This means that the element still occupies its original space, but can be completely invisible.

Usevisibility: hidden, the element will be hidden, but it will not disappear, it will still occupy space, and the original style of html will not be changed after hiding; it will be inherited by descendants, and descendants can also pass The displayed settingvisibility: visible;is used to anti-hide; the event bound to the element will not be triggered. Dynamically modifying this property will cause redrawing.

(Learning video sharing:css video tutorial)

The above is the detailed content of How to hide elements but retain position in css. For more information, please follow other related articles on the PHP Chinese website!