HTML dl, dt, dd tag production table duel Table production table

In the past, many web designers liked to implement their web renderings into web pages with table layout, but this would encounter a more troublesome problem, which is that it would be quite difficult to debug and maintain in the later stage. Now, more and more front-end developers are starting to use xhtml+css to replace the original table layout to complete the overall layout of the web page, which not only reduces the cost of development and maintenance of the website, but also makes the code more semantic. However, it does not mean that the table has disappeared from now on. It is still used by many people as a necessity for data representation on web pages, such as personal information data lists, etc. In fact, using html's dl, dt, and dd tags will save you more code and make the code more consistent with the semantics of the content. Of course, tables also have their use, that is, data tables with large amounts of data, but small data lists and forms can be completely avoided!

If you are still using traditional tables to create data lists, please continue to look at how using html's dl, dt, and dd tags to make your work easier...

Table data list

The data list code of a traditional table is shown below. We need to add a tr tag to each row, and then add a td tag to the title and data. Since the tags are td, if you want to add a style, you need to add a class attribute to each td.