Heim >Web-Frontend >CSS-Tutorial >Wie erzielt man die gleichen visuellen Effekte wie „cellpadding', „cellspacing', „valign' und „align' in HTML5-Tabellen?

Wie erzielt man die gleichen visuellen Effekte wie „cellpadding', „cellspacing', „valign' und „align' in HTML5-Tabellen?

DDD
DDDOriginal
2024-10-31 15:34:02257Durchsuche

How to Achieve the Same Visual Effects as `cellpadding`, `cellspacing`, `valign`, and `align` in HTML5 Tables?

So ersetzen Sie Cellpadding, Cellspacing, Valign und Align in HTML5-Tabellen

In HTML5 sind die Attribute Cellpadding, Cellspacing, Valign und align sind veraltet und nicht mehr gültig. Mit CSS können Sie jedoch immer noch die gleichen visuellen Effekte erzielen.

Cellpadding ersetzen

Verwenden Sie die Padding-Eigenschaft, um Platz in Tabellenzellen hinzuzufügen:

<code class="css">th, td {
  padding: 5px;  /* Equivalent to cellpadding="5" */
}</code>

Zellenabstand ersetzen

Verwenden Sie die Eigenschaft „border-collapse“, um den Abstand zwischen Tabellenzellen zu steuern:

<code class="css">table {
  border-collapse: separate;
  border-spacing: 5px;  /* Equivalent to cellspacing="5" */
}</code>

Alternativ können Sie „border-spacing: 0“ verwenden um den Abstand zwischen Zellen zu beseitigen:

<code class="css">table {
  border-collapse: collapse;
  border-spacing: 0;  /* Equivalent to cellspacing="0" */
}</code>

Valign ersetzen

Verwenden Sie die Vertical-Align-Eigenschaft, um den Inhalt von Tabellenzellen vertikal auszurichten:

<code class="css">th, td {
  vertical-align: top;  /* Equivalent to valign="top" */
}</code>

Align (zentriert) ersetzen

Verwenden Sie die Margin-Eigenschaft, um die Tabelle auf der Seite zu zentrieren:

<code class="css">table {
  margin: 0 auto;  /* Equivalent to align="center" */
}</code>

Das obige ist der detaillierte Inhalt vonWie erzielt man die gleichen visuellen Effekte wie „cellpadding', „cellspacing', „valign' und „align' in HTML5-Tabellen?. 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