The significance of HTML document structure on Div + CSS layout

I think about the contradiction between structure and development efficiency, and I have a question about how the CSS framework can not break the ring structure. In addition, my opinion on structure and efficiency is "having a reasonable structure is the fundamental motivation for your web standardization". The web carries information and has no reason for visual effect, and damage a reasonable structure.

The following points should be taken into account for Web standards:

Use structured and semantic tags
Use CSS to separate the representation elements in (X) HTML documents
Rely on javascript to enhance, instead of replacing, the characteristics of the website (for example, if css cannot do it, hand it over to Javascript instead of replacing css for what it can do)

I have always been disgusted with the structure of a declarative combination. I may not understand it deeply enough to understand its advantages. Maybe a rational combination can take into account both the structure and development efficiency, but I did not find it. I want to conflict.

The style combination method is as follows:
<Div class = "class1 class2... Classn "> </div>
Example of Layout
<Div class = "f-left w400 bgfff">
These classes are combined into a left floating area with a width of 400 and a white background.

You may have a huge library, and the page can be completed only by the combination of any class, saving most of the time spent on css, but it brings about structure chaos, the difficulty of revision, or even backward compatibility, is limited. This is no different from the table layout, but the code looks nice, and the amount of code is not much different. At the early stage of the Application of web standards, reasonable table layout is also allowed.

So many classes remind me of the lengthy table attributes.

<Table border = 0 CELLPADDING = 0 CELLSPACING = 0 ALIGN = center width = 100% HEIGHT = 100%>

Is it hard to use div with css to simulate a table that is easy to achieve? What's worse than table layout?

Semantics is also a part of the structure. In addition to the rational use of the (X) HTML markup language, the id is also a semantic part. The id of a div is like an instant post, it tells you the semantics of a div and the meaning of the block.

Microformat is a new method for embedding structured data in standard XHTML code. His birth clearly shows that the structure of the web is always the first. The semantic advantages are very realistic, and the property planning of div also reflects semantics, it is not just an interface passed to style work. Let's take a look at the ibm document center's article "using microformats to separate data and formats" to learn how it works.