Heim >Web-Frontend >CSS-Tutorial >Kann ich eine Tabelle nur mit „' und CSS erstellen?

Kann ich eine Tabelle nur mit „' und CSS erstellen?

Susan Sarandon
Susan SarandonOriginal
2024-12-25 10:38:09847Durchsuche

Can I Create a Table Using Only `` and CSS?

So erstellen Sie eine Tabelle nur mit
Tag und CSS

Verwenden Sie nur HTMLs

Element und CSS können Sie eine funktionale Tabelle erstellen, die browserübergreifend kompatibel ist.

Im bereitgestellten HTML-Snippet werden verschiedene Klassen zum Stylen der Elemente verwendet. Für ein browserübergreifendes Erlebnis können Sie das CSS wie folgt anpassen:

.div-table {
  display: table;         
  width: auto;         
  background-color: #eee;         
  border: 1px solid #666666;         
  border-spacing: 5px; /* cellspacing:poor IE support for  this */
}
.div-table-row {
  display: table-row;
  width: auto;
  clear: both;
}
.div-table-col {
  float: left; /* fix for  buggy browsers */
  display: table-column;         
  width: 200px;         
  background-color: #ccc;  
}

Im angepassten CSS:

  • Wir haben .divTable durch .div-table ersetzt Konsistenz.
  • Aus Gründen der browserübergreifenden Kompatibilität haben wir border-collapse:separate; von .divTable.

Dieses aktualisierte CSS stellt sicher, dass die Tabelle in allen gängigen Browsern korrekt angezeigt wird, einschließlich IE7 und niedriger.

Das obige ist der detaillierte Inhalt vonKann ich eine Tabelle nur mit „' und CSS erstellen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn