CSS we all know that the Web standards in the early days of China's dissemination, people use "div+css" to describe the Web standards, seems to be a bit of truth, according to the domestic web designer's coding level, it seems to use a div with CSS to replace the table layout.
But the people who have studied the Web standard for a while know that this is a misunderstanding, then some people put forward, abandon Div+css's argument, advocate Xhtml+css, because to use two languages to structure the Web page, but this name is also inaccurate, incomplete, Because only the XHTML1.0 standard and the CSS2.0 (CSS2.1) specification are mentioned.
In fact, the Web Standard is the Web standard, called the other is not right, he is the web development of some of the set of standards, xhtml,xml,css,dom,ecmascript, to develop these standards for better constraints, the Web platform (browser) developers, And we follow web standards development, also for their own sake, through the efforts of the public, forcing rogue developers to follow the uniform standards, reduce the difficulty of developers, so that our works better cross-platform, across the browser barriers (Ie,ff,opera, etc.), across the barriers to equipment (PCs, handheld devices, mobile phones, Printing equipment, etc.), across user barriers (color blindness, anomalous trichromatism, poor eyesight, physical disability, etc.).
Why follow Web standards for design and development? The previous paragraph has also been macro mentioned, Cross-platform unified in a standard, and ultimately reduce the difficulty of development. The concrete implementation certainly does not have a boss so great to join the standard cause, the businessman always according to the interest drive, is which interest drives them to apply the Web standard?
- Less code and components, easy to maintain
- Lower bandwidth requirements (more concise code) and lower cost.
- more likely to be searched by search engines
- Easy revision, no need to change page content
- To provide a printed version without copying content
- Improve the usability of the website.
When the end owner sees the code in the application Web Standard is very concise, there have been many never met Div, and then you show him, can be arbitrary revision, a variety of devices compatible, a variety of browser compatible, very good, the boss is very appreciative, so many benefits, we fully support the Web standards, and lead to the results, The Web Standard technical talent is hot, the application Web Standard development project increases, the development efficiency becomes the question, the development pattern still is groping, simultaneously also appeared in the Web standard application some wrong method, the div abuse, class's abuse, the structure is messed up, The emphasis on CSS is much more than the emphasis on XHTML.
What is a div? At the beginning of people's understanding is no semantics, the use of things to layout without semantics, is correct, since there is no semantics, div these three letters will not appear. Quote
Jeffrey Zeldman's explanation is "to explain the div with the phrase division is the most appropriate". Div and span are used as cuts to split documents, so they have semantics. The DIV union ID and Class attribute provide a common mechanism for adding a struct to a document. Div divides the document into a piece, how to distinguish this piece to layout? That is how to give a unique ID to the Div, the generic div gives a class value, and you can assign an ID on the class basis. If the ID does not appear to be able to, all class, as long as a reasonable name can be, you can for header area, add Class,
, class
IdheaderI'm telling you, this is the only and header area. But IDs are a property that best reflects the structure of a document. When you complain about not being reused for IDs, think about the power of IDs!
The attributes of IDs have incredibly powerful features. The id attribute can complete the following functions:
- As a style sheet selector, let's create a compact, minimized XHTML paging file.
- The goal anchor of the most hypertext link to replace the outdated name attribute (or forward compatible with her)
- As a reference method for special elements in a DOM based script.
- The name of the object element as a declaration.
- As a common purpose process processing tool (in the example of the Web-site: "When extracting data from an HTML page to a database, or converting an HTML document to another format, etc., this can be used to indicate an area")
Now also often appear the structure of the combination class, is to have a CSS framework, and then any combination of class to achieve the layout, seemingly a shortcut to improve efficiency, but the cost is to destroy the structure, (of course, there are exceptions, such as Grids
CSS) , the general practice is like TudouThe design of the foreground code
This maintenance has brought a lot of difficulty, that is, the structure design is not reasonable, just for div+css rather than for web standards.
Web standards to grasp a few points:
- Use structural, semantic markup.
- Separate presentation from the (X) HTML document using CSS.
- Rely on JavaScript as is enhancement for, not a replacement of, website features.
- Use structured, semantically labeled
- Using CSS to isolate performance elements in (X) HTML documents
- Rely on JavaScript to enhance, not replace, the characteristics of the site (for example, if CSS does not, give JavaScript instead of replacing CSS to do what he can do)
For the structure of a variety of combinations I have been very disgusted, maybe I do not understand the depth of the understanding of his benefits, perhaps a reasonable combination of structure and development efficiency, but I did not find, I will be inconsistent.
The style is combined in such a way that
give a layout example
Several classes are grouped into a left-floating, wide 400 background for a white area
You may have a Ponzi class library, the page only needs a combination of any class can be completed, eliminating most of the time spent on CSS, but the result is the structure of chaos, the difficulties of revision, or even backward compatibility is limited. This is the same as the table layout, but the code looks good, and the amount of code difference is not too big. In the early days of applying web standards, a reasonable table layout is also allowed.
So many classes remind me of the long table attributes.
micro-format (microformat)separating data and formatting using microformats
having a reasonable structure is your fundamental motivation for Web standardization
Is the hard work is to use DIV with CSS to simulate a table is easy to achieve the effect? and achieve the same poor table layout? Semantics is also a part of the structure, in addition to the rational use of (X) HTML markup Language, ID is a part of the semantic component, div ID is like an instant sticker, tell you the semantics of a Div, tell you the meaning of this block. is a new way of embedding structured data in standard XHTML code. His birth is also very clear that the structure of the web is always the first, the advantages of semantics is very realistic embodiment, Div's attribute planning also embodies the semantics, not just a pass to the style work interface. Take a look at an IBM Documentation Center article. "Understand how it works. Actually said so much, I also have a bit of no clue. The main thing is that I think about the contradiction between the structure and the efficiency of development, how the CSS framework can not break the ring structure of a doubt. And for structure and efficiency, my point is, " "The web is a bearer of information, and there is no reason to compromise a reasonable structure for visual effects."
