A brief analysis of the display attribute of css-CSS Tutorial-php.cn

This article mainly analyzes the display attribute of css with everyone. Friends who need it can refer to it. I hope it can help everyone. Let’s take a look with the editor below.

What are the commonly used values of display?

The values that are easier to use in normal project development are:

none (the element will not be displayed) ;
block (the element will be displayed as a block-level element, with line breaks before and after the element);
inline (the element will be displayed as an inline element, with no line breaks before and after the element);
inline-block (Inline block element. New value in CSS2.1);
table (The element will be displayed as a block-level table, similar to

, with line breaks before and after the table);
table-row (element will be displayed as a table row, similar to );

table-cell (the element will be displayed as a table cell, similar to

and < th>).

There is a difference between display="none" and visibility="hidden"?

At first glance, they all mean hidden elements; yes, they are indeed hidden elements! However, they are still different!

visibility="hidden" means (only) hidden and cannot be restored. When visibility is set to "hidden", although the element is hidden, it still occupies its original position. visibility preserves the element's position. After the element is hidden, it can no longer receive other events or respond to events, so it cannot be displayed through JS.

display="none" is hidden (the element disappears) and can be restored. When display is set to "none", except that the element is hidden, it is the exact opposite of visibility="hidden".

#The setting of display and visibility attribute values, as well as the difference between reflow and redraw! To learn more about reflow and redraw, please click: 《Page Reflow and Page Redraw》

What is the difference between dispaly:none in jQuery and zepto?

The difference between dispaly:none in jQuery and zepto! Most beginners probably still don’t understand it! If you want to know the difference between dispaly:none in jQuery and zepto, hey, then click: "The Difference between dispaly:none in jQuery and zepto"

Related recommendations:

Display attribute collection

Display common attributes of display elements

css display property

The above is the detailed content of A brief analysis of the display attribute of css. For more information, please follow other related articles on the PHP Chinese website!

Related labels：

display

source：php.cn

Previous article：Detailed explanation of CSS double flying wing layout Next article：Detailed explanation of whether css loading will cause blocking_CSS tutorial_CSS_Web page production

Statement of this Website

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

A brief analysis of the display attribute of css

What are the commonly used values ​​of display?

What are the commonly used values of display?