[スパルタコードクラブ]新年運勢コード(1週目)


ここまでは1週間目のレッスンです.

✔ hover



hoverマウスを使用すると、上のように動物名と背景色が変更されます.
.rtans > a:hover{
      background-color: darkred;
    }

✔ Flex


一列に並んでいるのはflexです.
flexは1次元ソートに良いプロパティです.
display:flex(inline-flexもあります)
flex-direction:(スケルトン設定)
row(デフォルト):行軸(左>右)
row-reverse:行軸(右<左)
column:列軸(上>下)
column-reverse:列軸(下>上)
flex-wrap:(コンテナオーバーフロー時に改行するかどうか)
nowrap(デフォルト):コンテナがオーバーフローしたときにねじれて1行として表示
wrap:コンテナオーバーフロー時に改行
flex-flow=flex-direction+flex-wrapは、次のように記述できます.
flex-flow:(flex-direction)(スペース)(flex-wrap);

<ソート>


rivided-内容:スケルトンの位置合わせ(水平位置合わせ)