忘れ去られたBlog再開

displayの使い方

inline,block、inline_block, noneの使い方について

displayプロパティは表示のされ方、高さと幅を指定できる。

block

  • 要素
  • 要素
  •   

    要素が横いっぱいに広がって縦に並ぶ。

    illine

    要素 要素 要素

    要素が平たく横に並ぶ

    inline-block

    要素  要素  要素

    blockとinlineの間

    none

    非表示

    • 一般的に使うのはdisplay: block, inline;

    • inlineは高さと幅は指定できないが左右のpadding,marginは指定できる。改行ははいらない。

    • inline-blockは高さ、幅、左右も指定できる、改行がはいらず横に並ぶ。

    土曜日の学習

    vscのcss修正

    display: inlineを使って横並びのコードを書いた。widthで幅を調整。

    imgタグのclassはcssでclassとして扱われるのでcssでは.が前につく。

    要素の間に縦線を入れるのはつけたい要素の中にclassをつくり、cssでつけたい側、border-left: 1px solid #カラー