先日ProgateのHTML&CSSⅡが終わったので、復習がてら再びウェブページを作ってみました。
今回はレンタルサーバではなく、Github pagesで公開してみました。
https://kumagoro95.github.io/webpage-sample/
相変わらずトップページだけのハリボテですが
前よりはいい感じになったかな?
HTML&CSSⅡで一番理解が難しかったのは、displayの設定です。
以下のページを参考にしました。
saruwakakun.com
inline、block、inline-block・・・正直、どういう時にどれを使えばいいのか今でもよくわかってません。
ただ、上記3つの特徴を比べてみると・・・
- blockは「要素と要素の間に改行が入り」、inline-blockは「要素と要素が横並びになる」
- block、inline-block共に「幅、高さの指定」と「余白の指定」ができる
- inline-blockは「text-align」「vertical-align」が使える(blockは使用できない)
ことがわかります。なんだかinline-blockが一番便利そうな感じがします・・・
要素間に改行を入れないのであれば基本的にinline-blockを使えばいいのかな?