将表转换为div

Question

我使用表格在3列中显示文字，但在手机上它不适合屏幕，所以我宁愿使用div。

它不会让我复制我在这里使用的代码，我可以在文本编辑中附加它吗？

感谢帮助

Answer 1

使用CSS可以创建表结构。在此解决方案中，我使用了display:table和display:table-cell来制作表格。这些都不是真正的表格。但是使用这个属性我们可以创建一个表格布局。

这是制作表格布局所需的CSS。我做了一个虚拟 Demo 。

#main_table{display:table; padding:5px;}
.column1, .column2, .column3{display:table-cell; vertical-align:top;}

以下是HTML代码。

<div id="main_table">
    <div class="column1">content will come here</div>
    <div class="column2">content will come here</div>
    <div class="column3">content will come here</div>
  </div>