テーブル要素のように、横に並べることが可能になります。親要素をテーブル、子要素をセルに設定することで、実現できます。テーブル要素のデメリットとして、柔軟なレスポンシブ対応に、対応しずらい点があります。【適している箇所】縦横の大きさが確定している画像を横に並べたり、整列させ...
「1.画像が上下にふわふわ動くアニメーション」のcssをtransform: translate(30px, 0);で左右・横方向に変更しているので、横に動くようになります。 こうすることで、左右にふわふわと動くアニメーションが表現できます。 3.画像が左右にゆらゆら揺れるアニメーション ...
このような、横並びでテキストを流し込むレイアウトを組むとき、divまたはpなどを2つ用意して、floatなどで組んでいたかと思います。 それを分けること無く、ひとつのボックスで複数の段組みを作るレイアウトをマルチカラムレイアウトと言います。 例として上の画像をあげましたが、上の...
content テキストや画像などの内容を表示する領域width、heightで大きさを指定する padding 枠線の内側の領域paddingプロパティで大きさを指定する border ボックスの枠線borderプロパティで大きさ、種類、色を指定する margin 枠線の外側の領域marginプロパティで大きさを指定する 4 その他の学びや注意...