search
New サムネイル 分断するメディアとインターネットのユーザー:ライトノベル、キズナアイ、TikTokに思うこと New サムネイル Golangのchiを使ったrouterの例 New サムネイル Golangの文字列(代入、結合・連結、部分文字列、置換)

CSSで最初(最後)の要素だけのマージンや幅を変える

広告

リストなどで要素を並べて、最後の要素だけマージンを変えたいという場合。

.header__social ul {
    display: flex;
}

.header__social ul li {
    margin-right: 16px;
}

.header__social ul li:last-child {
    margin-right: 0;
}

リストに last-child をつなげると、それはリストの最後の要素を表します。上のコードは要素の最後だけ右マージンを 0 にしている。

同様に要素の最初にデザインを入れたいときは

.header__social ul li:first-child {
    margin-right: 0;
}

などとする。

広告

広告

広告

コンピューター コンピューター
プログラミング プログラミング
数学 数学
英語 英語
国語 国語
理科 理科
社会 社会

Python入門

Python入門

化学入門

化学入門

漢字辞典

漢字辞典

整数辞典

漢字辞典

Lord Candy

Lord Candy