CSSのbackgroundプロパティを徹底的に身に付けよう

Web制作
ブッ君
ブッ君

背景画像はWebサイトを魅力的にする重要なプロパティだよ!

マー君
マー君

確かに背景画像がカッコイイWebサイトは魅力だね!!

backgroundプロパティを徹底解説

backgroundプロパティの基本

background-originの指定方法

背景画像の表示基点を操作するプロパティです!

background-blend-mode

画像の加工をコーディングで行うことが出来ます!

background-colorの使用方法

background-imageで使用するlinear-gradientの使用方法

background-imageとpadding-topで行う背景画像のレスポンシブ対応

background-attachmentで行うパララックス効果

background-clipで使用方法

テキストをおしゃれに加工できるプロパティです!

背景画像の複数指定

まとめ

  • backgroundプロパティで背景画像を操作する
  • background-attachmentでパララックス効果を実装する
  • background-clipでテキストを加工する
  • 複数の背景画像を実装する
  • background-imageとpadding-topでレスポンシブ対応

コメント

タイトルとURLをコピーしました