F12 use Google browser - Continued

In the front-end test function of time, often some inexplicable error, this time to develop open F12 would say look at it, so it feels this developer is useful, look, do the following records:

Elements:
the left column to view the page source DOM tree form (HTML), click to expand each node to see a specific code, such as testing found that some data is not displayed on the page, then opening the corresponding node to look at, whether to the Senate incoming normal is very useful.

And it will be on a page when you select a node real-time display of the selected node (marked with color), which is the most commonly used functions to debug web pages. Right you can edit the code of the selected node.
The right column shows the selected node in real time to match the CSS properties. CSS style attributes can modify the display of real-time changes to the page , which is one of the most commonly used functions, such as we can change the background color of a search bar.
Network:
list the page referenced images, audio, waterfalls streamed video and other files, and when you want to download something forbidden Web page, you can come here open source code, there is a small trick that is the longest time video (I know what a mess ==)

Sources：