background-position で「右から」とか「下から」などを指定する方法

CSS2.1ではbackground-positionプロパティを使用したさい、左から何ピクセル、上から何ピクセルといったように左や上からしか位置を指定できませんでしたが、CSS3になり、右から何ピクセル、下から何ピクセルといったように、背景画像の位置を指定することができるようになりました。

background-position:right 30px bottom 50px;

このように、rightとbottomの後に移動させたい量だけ数値を指定することで、右と下からの移動量を指定することができます。上の例では右から30px、下から50pxを指定したことになります。

これで背景画像を完全に好きな位置に配置できるようになりますね。

＝＝＝

「いいね！」と思ったら、クリックお願いいたします<m(__)m>

ABOUT ME

コレカラウェブ

コレカラウェブです。フリーランスとしてWebライティング・SEOコンサルティング・メディア運営・障害者支援のお仕事を一貫して承ってきました。このブログではコレカラウェブのお仕事で得たノウハウやテクニックを詳しく紹介しています。所有資格：認定SEOコンサルタント・SEO検定1級・Webライティング実務士・ウェブ解析士・応用情報技術者・情報セキュリティスペシャリスト・簿記2級・FP2級・AFPなど。

BLOG：https://corekara-web.net/blog/