Einfaches Beispiel für HTML Making Thin Line Table

In Bezug auf die Methode zur Erstellung dieser Dünnlinie-Tabelle kann Baidu eine Antwort haben, um Ihnen zu sagen, dass Sie diese Werte festlegen sollen: Setzen Sie Border = 0 Cellpacing = 1 BGColor =#990033 für die Tabelle und stellen Sie die Hintergrundfarbe für die Zelle separat ein, z. B. bgcolor =#fff. Es gibt jedoch wahrscheinlich keine detaillierte Erklärung darüber, warum diese Werte festgelegt werden!

Also habe ich heute plötzlich daran gedacht, die Prinzipien dieser dünnen Linientabelle aufzuzeichnen. Es liegt auch daran, dass ich heutzutage grundlegende Lektionen unterrichtet habe. Die Schüler verstehen die Prinzipien dieser dünnen Linientabelle nicht sehr gut. Wenn Sie also Anfänger möchten, werden Sie wahrscheinlich auf ähnliche Probleme stoßen, also werde ich hier darüber sprechen, warum diese Werte festgelegt werden.

Schauen wir uns zunächst einen Blick auf den Effekt, wenn Sie den Wert der Tabellenrandgrenze auf 1. Auch wenn Rand = 1 und den Abstand zwischen Zellenzellpaketen = 0 festlegen, sieht die Dicke der Tabelle immer noch rau aus:

Schauen wir uns an, wie der Effekt durch Erstellen dünner Linientische erzeugt wird:

Im Gegensatz dazu sind die Tische dahinter raffinierter.

Jetzt werde ich die Schritte zum Erstellen einer dünnen Linientabelle zusammenfassen:

Schritte, um eine dünne Linientabelle zu erstellen:

1. Stellen Sie die Hintergrundfarbe der Tabelle fest (dh die Farbe des visuellen Tabellenrandes);
2. Stellen Sie die Hintergrundfarbe von TD (Zelle) fest (visuell die Gesamtfarbe der gesamten Tabelle)
3. Setzen Sie den Randwert der Tabelle auf 0 (Border = 0), und der Abstandswert beträgt 1 (Zellbereich = 1, so dass die Hintergrundfarbe der Tabelle durch diesen Abstand angezeigt wird und ein visueller Rand wird).

Analyse: Die Hintergrundfarbe der Tabelle ist eigentlich die dünne Linie, die in der visuellen Form aussieht, da wir den Rand auf 0 setzen und der Abstand zwischen den Zellen auf 1 gesetzt ist. Die Hintergrundfarbe der Tabelle ist die Farbe, die durch den Spalt dieses Pixels aufgedeckt wird. Stellen Sie die Hintergrundfarbe der Zelle ein, um sie von der Hintergrundfarbe der Tabelle zu unterscheiden. Für ein besseres Verständnis werde ich Bilder verwenden, um es hier zu analysieren:

1. Angenommen, der folgende Tabellenrand = 1 wird wie folgt angezeigt:

2. Wenn der Zellabstand eingestellt ist, befinden sich Zellpaket = 0, zwei 1-Pixel-Kanten nebeneinander, und der Rand erscheint dick:

Daher kann der dünne Linieneffekt nicht durch Rand eingestellt werden = 1

Dann verwenden wir die Dünnlinienmethode, um das folgende Prinzip zu erstellen:

Wenn dieser Artikel für Sie hilfreich ist, empfehlen Sie ihn bitte

Originaladresse: http://www.cnblogs.com/xcaocao/p/5643351.html