What exactly is DIV CSS?_html/css_WEB-ITnose

What exactly is DIV CSS?
I think there must be many friends who don’t understand it. In fact, I may not understand it either, but I still want to write down my understanding, maybe it can help those who want to learn, or can’t learn it at the beginning. Friends who know how to get started.
When we usually design web pages, we usually use Table to layout the entire page. Now we can use DIV CSS to implement the layout. For example, if we design a web page with a top, middle, and bottom structure such as header, body, and footer, we can define several DIVs to implement it, as follows:

Such a page layout has been designed. The next step is to design the CSS style, such as making the page center, width, header , what is the height of the footer, etc.
The CSS design can be separated from the page and stored in a separate file. Of course, all web pages can use the styles in the CSS file.