ホームページ > ウェブフロントエンド > htmlチュートリアル > CSS_html/css_WEB-ITnoseのdisplay/float/position属性値の相互影響

CSS_html/css_WEB-ITnoseのdisplay/float/position属性値の相互影響

WBOY
リリース: 2016-06-24 11:26:14
オリジナル
1224 人が閲覧しました

レイアウトとボックスの作成に関連する 3 つのプロパティ: 'display'、'position'、および 'float' があり、次のように相互作用します:

'display' の値が 'none' の場合、'position' ' と 'float' '効果はありません。この場合、ボックスは生成されません。
それ以外の場合、「position」値が「absolute」または「fixed」の場合、ボックスは絶対位置に設定され、「float」の計算値は「none」になり、「display」の値は次のように設定されます。ボックスの位置は、「top」、「right」、「bottom」、「left」プロパティとそのボックスを含むブロックによって決まります。
それ以外の場合、「float」の値が「none」でない場合、ボックスはフローティングとなり、「display」の値は以下のように設定されます。
それ以外の場合、要素がルート要素である場合、'display' の値は次のように設定されます (list-item で指定された値を除きます。値は 'block' または 'list-item' として計算されますが、これは未定義です) CSS2.1 では)

それ以外の場合、「display」属性の値は指定された値になります。


ここで、inline-flex は、CSS3 エラスティック レイアウト モジュールによって導入された新しい属性値です。


参考リンク:

1. https://www.w3.org/TR/css3-flexbox/#flex-containers


2. /visuren.html#dis-pos-flo



by iefreer

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート