表示:テーブルセル属性の演習

display:table-cell 属性は、ラベル要素が td ラベルと同様にテーブル セルの形式で表示されることを意味します。現在、IE8 以降とその他の最新のブラウザーはこの属性をサポートしていますが、残念ながら IE6/7 では実際のプロジェクトでの display:table-cell 属性の適用が大幅に制限されています。

セルには、要素の垂直方向の中央揃え、関連するスケーリングなどの特別な属性があることは誰もが知っているため、IE6/7 はこの属性をサポートしていませんが、display:table-cell には依然として多くの潜在的な価値があります。幸いなことに、IE6/7 のいくつかの厄介なプロパティとレンダリングにより、同じまたは類似の効果を他の方法で実現できます。

他のいくつかの表示属性と同様に、table-cell も float、position:absolute などの他の CSS 属性によって破棄されます。そのため、display:table-cell と float:left または Position:absolute 属性を使用する場合は、そうしないようにしてください。一緒に使用してください。 display:table-cell が設定された要素は幅に非常に敏感で、マージン値には反応せず、パディング属性には反応しません。これらは基本的に td タグ要素と同じです。

vertical-align 属性は、要素が配置されている行のベースラインを基準としたインライン要素のベースラインの垂直方向の配置を定義します。負の長さの値とパーセント値を指定できます。これにより、要素が上がるのではなく下がります。表のセルでは、このプロパティはセル ボックス内のセルの内容の配置を設定します。

/*水平方向のセンタリングを設定します*/

text-align:center
/* IE 用のハック */
*font-family:Arial;/*Prevent GBK などの非 UTF-8 によって引き起こされるハッキング失敗エンコーディング*/
幅: 200px;
高さ: 200px;
垂直整列:middle;

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。