Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Wie zeige ich Ränder leerer Zellen in CSS an?

Mary-Kate Olsen
Freigeben: 2024-11-12 03:38:01
Original
941 Leute haben es durchsucht

How to Display Borders of Empty Cells in CSS?

CSS zur Anzeige der Ränder leerer Zellen

In Tabellenlayouts können leere Zellen ihre Ränder verbergen, was es schwierig macht, eine visuelle Konsistenz zu erreichen Aussehen. Insbesondere im Internet Explorer 7 werden leere Zellen möglicherweise nicht mit sichtbaren Rändern gerendert. Um dieses Problem zu beheben, ziehen Sie die folgenden CSS-Lösungen in Betracht:

Verwenden eines geschützten Leerzeichens ( )

Eine Methode besteht darin, ein geschütztes Leerzeichen ( ) einzufügen die Zelle. Dieses Zeichen nimmt den Platz ein, sodass der Rand gerendert werden kann:

td:empty {
  content: ' ';
}
Nach dem Login kopieren

Leere Zellen ausblenden

In IE8 werden leere Zellen standardmäßig angezeigt. Um sie auszublenden und ihre Ränder anzuzeigen, können Sie das folgende CSS verwenden:

td:empty {
  empty-cells: hide;
}
Nach dem Login kopieren

Dieser Ansatz funktioniert jedoch nicht in IE7. In diesem Browser werden leere Zellen standardmäßig ausgeblendet, was es schwierig macht, ihre Ränder allein mit CSS anzuzeigen.

Andere Überlegungen

Wenn Sie eine reine CSS-Lösung benötigen, Möglicherweise müssen Sie browserspezifische Problemumgehungen oder alternative Methoden in Betracht ziehen, z. B. die Verwendung von JavaScript oder Tabellenberechnungen zur Verarbeitung leerer Zellen.

Das obige ist der detaillierte Inhalt vonWie zeige ich Ränder leerer Zellen in CSS an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage