mit würde Ich mag einen Tisch ziehen, ohne <table><td><tr> hatte ich gegoogelt jede viele Lösung zu finden, so können die Menschen die <div> + CSS jede einfachste Weg oder andere bewährte Praktiken verwenden, es zu zeichnen ?Draw/Design HTML ohne <table><tr><td>
Nun, Sie können eine Markdown-Sprache wie Jade verwenden oder Sie können ein HTML-Tag wie ein Div verwenden und es als Tabelle mit CSS anzeigen.
Die <table><tr><td> sind für die beste Implementierung von Tabellen. Warum benutzt du sie nicht?
Sie die Tabelle mit dieser einfachen Codes implementieren können:
HTML
.table{
\t border:1px solid black;
\t clear: both;
}
.table>div{
\t width: 100%;
\t float: left;
\t clear: both;
\t border:1px solid red;
}
.table>div>div{
\t width: 25%;
\t float: left;
\t border: 2px solid yellowgreen;
\t box-sizing: border-box;
}
.clearfix{
\t clear: both;
}<!DOCTYPE html>
<html lang="en">
<head>
\t <meta charset="UTF-8">
\t <title>table</title>
</head>
<body>
\t
<div class="table">
\t <div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t </div>
\t <div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t </div>
\t <div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t \t <div>item</div>
\t </div>
\t <section class="clearfix"></section>
</div>
</body>
</html>können Sie die display CSS attributes verwenden, um diese zu erreichen:
div {
display: table;
display: table-cell;
display: table-column;
display: table-colgroup;
display: table-header-group;
display: table-row-group;
display: table-footer-group;
display: table-row;
display: table-caption;
}
Sie offensichtlich muss dich setzen r CSS in Ihrem Stylesheets aber the idea is:
<div style="display: table;">
<div style="display: table-row;">
<div style="display: table-cell;">
Here is a cell.
</div>
</div>
</div>
Warum?
Das Tabellenelement ist genau das Element, das Sie zum Zeichnen von Tabellendaten verwenden möchten.
Es gibt zu Recht einen Trend im modernen Webdesign, der die Verwendung von Tabellen zur Positionierung runzelt. Dies bedeutet nicht, dass Sie nie Tabellen verwenden sollten.
Ein bisschen Geschichte. Bevor CSS von Browsern erfunden und richtig unterstützt wurde, waren Tabellen, auf die man sich stark verließ, um Inhalte zu positionieren. Ehrlich gesagt machen sie in dieser Hinsicht eine großartige Arbeit. Es ist sehr einfach, eine Tabelle zu erstellen, die Designelemente genau dort positioniert, wo Sie sie haben möchten, aber nur vorausgesetzt, die Benutzer Ihrer Website haben einen Monitor mit ähnlichem Seitenverhältnis und Auflösung zu Ihrem und dass sie auf Ihrer Website Vollbild betrachten. Es ist sehr schwierig, fließen Design-Elemente mit Tabellen.
Gerade das, was sie für die Positionierung schlecht macht, macht sie für tabellarische Daten (d. H. Daten, die in einer Tabelle angezeigt werden sollten) perfekt. Stellen Sie sich vor, wenn sich die Zellen in einem Finanzbericht bewegen und ihre Position ändern, wenn die Größe geändert wird. Um
sumarize: