So zeigen Sie den Rand von td an, wenn es sich um eine leere_HTML/Xhtml_Webseitenproduktion handelt

Ich habe zuvor zusammengefasst, wie man CSS verwendet, um den hellen und dunklen Randeffekt des Tischrandes, bordercolordark, bordercolorlight, zu erzielen, und dann fragte mich ein Internetnutzer, warum er einen ähnlichen CSS-Stil geschrieben habe, aber der Randeffekt der Tabelle ist nur normal zu sehen Unter Opera und unter IE gibt es dann nichts.
Ich habe Opera 9 heruntergeladen und festgestellt, dass dies tatsächlich der Fall ist. Der Grund ist nicht kompliziert: Denn wenn unter IE (Firefox scheint mit IE konsistent zu sein) der Inhalt eines td leer ist, wird der Rahmenstil der Zelle nicht in Opera angezeigt, selbst wenn Sie die Höhe und Breite festlegen Unabhängig davon, ob Inhalt vorhanden ist oder nicht, werden für die Darstellung immer Stile verwendet. Ich bin gleich nach meinem Abschluss auf dieses Problem gestoßen, um mich zu fragen. Später sagte ich zu ihm: Fügen Sie es einfach zu jedem leeren TD hinzu. Jedes Mal, wenn ich in Zukunft auf dieses Problem stoße, werde ich es auf diese einfache, grobe und effektive Weise lösen.
Aber heute habe ich viel recherchiert und von Jiarry erfahren, dass die ursprüngliche CSS-Syntax es uns ermöglicht, diese Standardverhaltensweisen zu ändern: Mit border-collapse:collapse; Die verschwindenden Ränder werden angezeigt.
class="test1": add border-collapse:collapse;
border:1px solid #999999;
width:60%
}
.test1 td{
border-bottom:1px solid #999999;
height:28px;
padding-left:6px;}
class1 Hier ist Inhalt
Hier ist Inhalt
class="test2": add border-collapse; and empty-cells:show
.test2{
border:1px solid black; :collapse ;
width:60%
}
border-bottom:1px solid black;
padding-left:6px
empty -cells:show;
}
class2 Hier ist Inhalt
Hier ist Inhalt
class="test3": Ohne Hinzufügen von border-collapse:collapse;
.test3{
border:1px solid #999999;
width:60%
}
.test3 td{
border-bottom:1px solid #999999;
height : 28px;
padding-left:6px>}
class3 Inhalt hier
Inhalt hier