写真を並べてみる〜ファイルの作成と画像の追加〜

Flexboxとは？
シャッフルコンテンツを読み込む	[シャッフル] 写真を並べてみる〜ファイルの作成と画像の追加〜
[シャッフル] 写真を並べてみる〜HTML編〜
[シャッフル] 写真を並べてみる〜CSS編〜
[シャッフル] Flexbox実戦課題
[シャッフル] Flexbox実戦課題答えの例 ×1

Flexboxの威力を発揮し、仕組みが分かりやすいのが、画像を並べる場合です。

今回は、3列の画像を左上から右に向かって並べていく形をつくっていきます。
下の手順に沿って、準備を進めてください。

<html>
    <head>
        <link rel="stylesheet" href="style.css">
    </head>
    <body>
    </body>
</html>

これで準備は完了です。
フォルダやファイルの名前などは自由に決めて問題ないので、好きな名前をつけてください。

最終更新: 2021/02/15 00:00