【CSS】複数の背景画像の設置方法

CSSでひとつのクラスに複数の背景画像を設置することが可能です。
記述は以下のようになります。

background-image: A,B,C;
background-repeat: A,B,C;
background-position: A,B,C;
background-size: A,B,C;

具体的には以下のようになります。

.icon {
    background-image: url(./icon.svg), url(./icon2.svg);
    background-repeat: no-repeat, no-repeat;
    background-position: 0 50%, 100% 50%;
    background-size: 10px, 15px;
}

参考:https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Backgrounds_and_Borders/Using_multiple_backgrounds

関連記事

コメントを残す

*