CSS表示と可視性

2012 ワード
コリン CSSベース テキストリンク
簡単に考えてから書くときは、混同された概念をテーマに見つけて、解いてから整理し直します.
受講時にはblockとinline-blockの区分、display : none;とvisibillity : hidden;の区分を混同して整理しておきます.

🌱 なぜinline-blockを使うのですか?直接塊にしてはいけませんか?


📌 display:要素のプロパティの表示方法を決定する

display : block;
div,p,h,liタグなどは基本的にblock属性を持つ.
各要素は1行を占めます.
サイズ、マージンに関連するプロパティを持つことができます.
display : inline;
span、strong、aタグなどは基本的にinline属性を有する.
各ラベル内のコンテンツに適したサイズがあります.
サイズ、余白に関連する属性を持つことはできません.2つの余白(padding、margin)を使用できます.
display : inline-block;
サイズと余白を任意に指定して、inlineなどの複数の要素を1行に含めることができます.
ライン要素を行全体を占有せずに自由にサイズを調整できるようにします!
display : none;
要素を完全に消す.
要素の既存のすべての領域を無視します.

🌱 display : none;何が違うの?


📌 ≪可視性｜Visibility｜oraolap≫:要素の属性を表示するかどうかを指定します。

visibility : hidden;
エレメントを非表示にします.
上記のdisplay : none;とは異なり,要素は従来の領域を占め,内容のみを遮っている.
visibility : visible;
要因を表示します.
Instagramクローン計画-(10)
Python文字列正規表現