CSS 背景画像を右下から数値指定する方法

CSS 背景画像を右下から数値指定する方法

CSS で background-position を使って指定した背景画像を、右や下、右下から指定する方法を紹介します。
例えば、背景画像をデザインのアクセントとして右下から数値指定したい場合に便利な方法です。

背景画像を右下から数値指定する方法

background-position を使った背景画像の指定は、左からした設定できないと思いがちですが、実は右や下、右下からも数値指定することができます。
例えば、背景画像を右 10px 下 10pxの位置から表示したい場合、background-position を次のように指定します。

background-position : right 10px bottom 10px;

まとめ

CSS で background-position を使って指定した背景画像を、右や下、右下から指定する方法を紹介しました。