Heim > Artikel > Web-Frontend > Wie werden die Ränder der Tabelle nach dem Festlegen von border-collapse:collapse zusammengeführt?
Ich bin auf einen Rahmen gestoßen, der abgerundete Ecken benötigte, und dann stellte ich fest, dass das Festlegen von border-collapse:collapse, border-radius:5px nicht funktionierte, und stellte fest, dass es sich dabei um CSS selbst handelte existiert, und die beiden können nicht miteinander vermischt werden. Daher wurden andere Methoden verwendet, um abgerundete Tischecken zu erzielen.
Aber jetzt möchte ich wissen, wie der Rand der Tabelle und die Ränder von td und th zu einem Rand zusammengeführt werden?
Ähnlich wie beim Schnittpunkt zwischen der oberen linken Ecke der Tabelle und der ersten Ecke bleibt nach dem Zusammenführen der beiden Ränder der Rand der Tabelle oder der Rand der Tabelle erhalten? Wenn der Rand von th beibehalten wird, warum hat das Festlegen des Randradius in der oberen linken Ecke des ersten th dann immer noch keine Auswirkung?
Abführmittel-v-, es ist einfach so passiert, dass ich letzten Freitag, als ich es in der Gruppe teilte, die Priorität des Randzusammenbruchs erwähnte. Der w3c-Abschnitt über Tabellen enthält Anweisungen für den Rand -collapse: Konfliktbehandlung reduzieren.
Das Dokument enthält zwei detaillierte Beispiele, die sehr intuitiv sind.
Hier fasse ich zusammen: (premise border-collapse: Collapse)
1. border-style = [hidden|none]
hidden hat die höchste Priorität, wenn zwei Ränder erzeugen Aggregation. Solange einer von beiden auf „Ausgeblendet“ gesetzt ist, wird im Endergebnis kein Rahmen angezeigt. Solange einer von beiden auf „Keine“ gesetzt ist, wird keiner angezeigt direkt für das Ergebnis verwendet werden.
Normalerweise zeigen border-style:hiden und border-style:none den Rand nicht an. Es gibt einen Unterschied, wenn border-collapse:collapse verwendet wird.
2. Wenn border-width inkonsistent ist, hat die größere border-width Vorrang
3 Wenn die Breite gleich ist, verwenden Sie diese Priorität: „double“, „solid“, „dashed“, „dotted“, „ridge“, „outset“, „groove“, „inset“.
4 Die Farbe ist einfach anders: Gemäß der hierarchischen DOM-Struktur ist der Rahmenstil des untergeordneten Elements besser als der Rahmenstil des übergeordneten Elements. [Zelle > Zeilengruppe > Tabelle]; Wenn es sich bei der hierarchischen Struktur um eine Geschwisterbeziehung handelt, haben die linke und die obere Seite Vorrang. Besonders interessant ist jedoch, dass die Spezifikation die Kollapslogik der Ecke nicht spezifiziert, sodass die Leistung unter Chrome und Firefox unterschiedlich ist. .
Das Bild unten ist ein Bruder-TD, nur die Farbe ist inkonsistent, dann ist links Chrome und rechts Firefox
Das obige ist der detaillierte Inhalt vonWie werden die Ränder der Tabelle nach dem Festlegen von border-collapse:collapse zusammengeführt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!