html - 怎么选择合适的标签？什么时候用<table>

Question

需要实现以下图的效果：

比较符合表格样式，但是对于table标签进行展开、收缩的开销不是很大吗？那这种情况应该使用什么标签比较好？
另外什么时候才需要用<table>标签呢？display:table和<table>的差异在哪里？小白求解答。

Answer 1

Nest a sub-table or p, expand and hide it directly using css to control the display to none or block.

Answer 2

CSS is compatible, but the table does not conform to semantics. It depends on what to do,

Answer 3

Personally, I feel it is better to use ul li here
Display is table, which is not easy to use and quite troublesome. I just tried it. And this can easily mislead other developers, so it is not recommended to use it that way.

Answer 4

After checking the information, I found that if it is a data-type table, you can use the table tag. If it is just to display the column style of the table, there is no need to use table. You can use display:table or display:flexbox to achieve it.

Answer 5

From a semantic perspective, it is recommended to use table if the presentation form is a table. The
<table> tag defines an HTML table.
display: table; specifies the object as a table at the block element level, similar to the html tag <table>