Who knows the extracted content?

Record some good summary content, excerpt of the original online (http://www.zhangxinxu.com/wordpress/), only used to know. 1.1 drops of accumulation. Haha, enjoy it slowly...

Display: none is a terrible statement. All future generations are killed (in a single connection), and no space is left for burial ), as a result, the whole people will be stunned (rendering and Backflow ).
Visibility ), the Chinese people are relatively indifferent (no rendering and Backflow ).

Remember this: when the position: absolute element overflows the overflow: hidden element, if its first ancestor element (until the body) containing the position attribute (except static) is overflow: when the hidden element is the ancestor element, it is not hidden; otherwise, it is hidden.

Layer 3: targets machines, developers, common users and special users under normal conditions
The third layer is that the text corresponding to the image is retained in the tag, which is hidden by some highly available technologies.
Overflow: hidden is missing when the negative value of text-indent is set.

Text hiding technology after image-z-index negative value hiding
According to my own understanding: the negative value of Z-index allows the element to be displayed on the first parent element containing the location attribute (relative/absolute, etc, the parent element is displayed under other child elements. Because the body is a special top-level positioning element, we can basically divide it into two situations.

Whether it's a cell phone with a small screen or a desktop device with a large screen, the pictures connected by the IMG are all small pictures by default.
After the page is loaded, if the display width exceeds the limit, the SRC address is switched to the large image address.
Among them, the key is that if the display width is greater than a certain value, the height and width of the thumbnail will be enlarged, that is, the thumbnail will be stretched and displayed.

Cookie + server implementation
This technology is introduced on GitHub. This technology requires the cooperation of JavaScript and background programs.
Load the JS file responsive-images.js, The JS file to get the current user display width, and then according to the width value of the size of the Decision picture is small (small) It, medium (medium) it is still large (large), and then write the corresponding cookie.
The following is what happens on the server side. The server (which can detect through configuration items) checks whether the cookie is set to small. medium or large determines which SRC address the image is.