difference:
1. Different space occupied.
Visibility seize the domain space, but the display is not occupied.
Visibility show and hide page , for example:
The display element property to block after the line feed element.
The element is displayed inline property to eliminate the element wrap.
The element display property to none to hide elements of the content without taking up space domain.
The "Element visibility" attribute set to "hidden" to hide elements of content, but the space domain.
The "element visibility" attribute set to "visible" to display the element content.
2. Different responses to the normal flow of the document.
If you want to hide an element, but leave room for the element on the page, you should use visibility: hidden. If you want to hide elements in the blank filled with other content, you should use display: none.
In fact, I find that people are more inclined to use the Display Properties (I believe this is most people's habits). When you decide to hide a display element: No, you have to know other content that will fill the void left by the elements, thereby changing the layout of the page.
Extended Data
Sometimes we have to cheat by hiding keyword SEO, but instead of using the visibility: hidden and display: none, we should set the same color as the background color keyword or keyword size is very small, so that visitors will not find them .
Some people worry that using visibility: hidden and display: No, because they are afraid of spiders exclusion. In fact, by switching elements visibility, you can get a lot of beautiful effects.
Search engines understand this approach (in fact, search engines tend to ignore CSS), so if your goal is not to deceive search engines, you can safely use visibility: hidden and display: none to hide the contents.