CSS basics How to avoid table obsessive-compulsive disorder

Source: Internet
Author: User

Page-oriented design rather than browser-oriented design

XHTML+CSS can achieve a flow layout, that is, as the length of the content automatically grow the region, and ultimately lead to the entire page growth, then the browser must display scroll bar. A symptom of table obsessive-compulsive is the effort to avoid the flow layout, hoping that the viewable area of the browser is the layout target, requiring that the content area be divided in the viewable area rather than the content area on the page. In fact, XHTML is not designed for browsers, because it contains only semantics, or content, and how browsers express these things is beyond our certainty. CSS provides a way to control the way we behave, but it's only for the mainstream browsers, and there's a slight difference in the "instruction set" that browsers support (for that, I really want to be able to write CSS for a browser and compile it into full platform compatible code), Finally, these directives only support streaming layout control for the page. So if you decide to start writing semantically compliant XHTML and just control the layout with CSS, you first need to turn your ideas into layout-oriented (or document) control rather than layout control for the browser's visual area.

Then there must be someone to say, "then you admit that some of the old ways of layout are easy to do, but the new method is hard to do." This is of course, but this does not justify our continued use of table. It's time to turn to the original target, why should we control the layout? Low-level demand is for beauty, everyone wants the same content to be displayed in the eyes of the user with a better visual effect, and the high-level requirement is to control the audience's browsing style, so that they can distinguish the light focus of the content of the page in the way we designed in advance, and browse for some content according to our expectation. It also helps them find the content they want faster, without being frustrated on our site. Now that we've identified the goal of controlling the layout, let's take a look at CSS as "no way to get things done". First of all, CSS can also make beautiful pages, although some layouts do not, but under the restrictions of CSS to do the same aesthetic degree of the page is sure no problem. Second, CSS can also make the design become friendly, do not say that the design of CSS is definitely "clean" to the user can not see the ability to find his desired function. As a result, although CSS does not achieve certain layout effects, it is sufficient for the designer to achieve the same effect as the old method can achieve.

Remove content-independent visual elements from XHTML

Another symptom of a table obsessive-compulsive disorder is that it is customary to correspond to an XHTML element for each visual element. In table, no matter how complicated the visual effect is, we can always cut the table, even table set table, until the exact location of each particular element. However, after applying CSS, this is unnecessary, even to the designer, because Xhtml+css is to separate the content and layout, so if a visual element is not related to the content, then it should not appear in XHTML, and naturally does not correspond to an XHTML element.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.