A brief discussion on the coexistence of DIV and TABLE

We know that div and table are essential tags for front-end design. Their functions are mostly the same, but there are also many differences. In this article, we will briefly talk about the coexistence of DIV and TABLE.

About tables

After using WEB standards, it does not mean that the use of tables is excluded. Tables are not useless, but on the contrary, they are a feast. The reason why there are many discussions about CSS layout The sentence "Why is it unwise to use tables for layout" is often mentioned in articles. It may be that everyone has a wrong understanding of it. Please note that "Using tables for layout" is " unwise" " refers to what we have been using for many years. It is unwise to use tables for layout. In the final analysis, tables are a way to display "data". You can imagine EXCEL , tables are used for this purpose. Sometimes information is displayed in tables so that we can read it clearly and easily, so we use tables, such as company employee contact forms, product and model correspondence tables, etc. So what is the so-called feast of tables? In fact, opinions have increased. At a certain level, that is to say, if you can flexibly use tables to display information such as customer data and survey data like a professional market analysis company, then you can truly take advantage of the table.
So, about that sentence If it has been used for a long time, it should be changed to "Use tables as web page layout. It is unreasonable to layout page elements. Tables are used to display data".

About other elements

Based on my experience, I divide some elements in the XHTML standard into three major categories:
The first category is what I call auxiliary layout design elements: here I refer to p, SPAN, etc., the main function of these elements is to layout the entire page. Flexible use of various attributes of these elements can make your page performance rich and colorful.
The second category I call structured elements or information Elements here refer to TABLE, UL, PRE, and CODE elements, which are a way of displaying and organizing information. For example, TABLE is obviously used to display table information, and UL is used to display columnar information. When tables or When making a list, it is wise to use these two methods to display it
The third category refers to A meta, which is purely for realizing some functions, such as META keyword for filling in keywords, and A for linking. . Then the correct standard-compliant design idea is: Use layout elements such as p to create the design layout, positioning, color blocks, pictures, etc. of the page. Use elements such as TABLE, UL, etc. to display the data that needs to be displayed on the page. Of course, p also plays a role. To organize data, use the ID attribute of p to easily treat a p as a data block named by you. Therefore, using WEB standards to create a website is actually a process of rationalizing and integrating information. You should still use whatever elements should be used wherever. Don’t use tables as layout tools.

Related recommendations:

How to use DIV and CSS to make a navigation bar

How to use the table tag in HTML

Analysis on automatic line wrapping when DIV and TABLE exceed width in CSS web page layout_html/css_WEB-ITnose

The above is the detailed content of A brief discussion on the coexistence of DIV and TABLE. For more information, please follow other related articles on the PHP Chinese website!