How to avoid displaying elements in css

How to implement non-display elements in css: You can use the display and visibility attributes, such as [display:none;visibility:hidden;]. The display attribute specifies the type of box the element should generate, and the visibility attribute specifies whether the element is visible.

The display and visibility attributes in css can be used to hide and show html elements.

(Learning video sharing: css video tutorial)

display attribute:

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

Attribute value:

• none This element will not be displayed.

• block This element will be displayed as a block-level element, with line breaks before and after this element.

• #inline Default. This element will be displayed as an inline element with no line breaks before or after the element.

• #inline-block Inline block element. (New value in CSS2.1)

• list-item This element will be displayed as a list.

visibility attribute:

The visibility attribute specifies whether the element is visible.

• visible Default value. The element is visible.

• hidden The element is invisible.

• collapse When used in a table element, this value deletes a row or column, but it does not affect the layout of the table. The space occupied by a row or column is freed for other content. If this value is used on another element, it will be rendered as "hidden".

• #inherit Specifies that the value of the visibility attribute should be inherited from the parent element.

Code example:

Achievement effect:

After hiding the second row, it still occupies the original position. After hiding the fourth row, it does not occupy the original position.

Related recommendations: CSS tutorial

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