display:table-cell bedeutet, dass das Label-Element in Form einer Tabellenzelle dargestellt wird, ähnlich dem td-Tag. Derzeit unterstützen IE8 und andere moderne Browser dieses Attribut, aber IE6/7 kann sich nur entschuldigen. Diese Tatsache schränkt auch die Anwendung des display:table-cell-Attributs in tatsächlichen Projekten stark ein.
Wir alle wissen, dass Zellen einige spezielle Attribute haben, wie z. B. die vertikale Ausrichtung von Elementen in der Mitte, zugehörige Skalierung usw., sodass display:table-cell immer noch einen großen potenziellen Verwendungswert hat, obwohl IE6/7 dies nicht unterstützt Eigenschaften, aber glücklicherweise hat IE6/7 einige chaotische Eigenschaften und Renderings, und wir können die gleichen oder ähnliche Effekte auf andere Weise erzielen.
Ähnlich wie einige andere Anzeigeattribute wird table-cell auch durch andere CSS-Attribute wie float, position:absolute zerstört. Versuchen Sie daher, display:table-cell nicht mit den Attributen float:left oder position:absolute zu verwenden . Gleiche Verwendung. Elemente mit der Einstellung display:table-cell reagieren sehr empfindlich auf die Breite, reagieren nicht auf Randwerte und reagieren auf Füllattribute. Sie ähneln im Grunde einem td-Tag-Element.
Das Attribut
vertical-align definiert die vertikale Ausrichtung der Grundlinie eines Inline-Elements relativ zur Grundlinie der Zeile, in der sich das Element befindet. Ermöglicht die Angabe negativer Längenwerte und Prozentwerte. Dadurch wird das Element abgesenkt, anstatt es anzuheben. In Tabellenzellen legt diese Eigenschaft die Ausrichtung des Zellinhalts im Zellfeld fest.
.box {
/*Vertikale Zentrierungsmethode erkannt von Nicht-IE-Mainstream-Browser*/ /*Set level Center */ 5px;/*ca. 0,873.200 der Höhe *0,873 ist ca. 175*/
0px; #eee; Vertical-align:middle;
/div>
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
