Skip to content

Instantly share code, notes, and snippets.

@andishe-wpd

andishe-wpd/background.css

Created December 30, 2023 16:31
Show Gist options
  • Save andishe-wpd/f530cd57b13e74d67910a716a6268053 to your computer and use it in GitHub Desktop.
Save andishe-wpd/f530cd57b13e74d67910a716a6268053 to your computer and use it in GitHub Desktop.
Download ZIP
using some background option on CSS
Raw
background.css
.element {
background:
url('background-image1.jpg') top left/cover no-repeat,
url('background-image2.jpg') bottom right/cover no-repeat,
linear-gradient(to right, #3498db, #2ecc71);
background-blend-mode: multiply;
background-origin: content-box;
background-clip: padding-box;
background-attachment: fixed;
}
@andishe-wpd
Copy link
Author

background-blend-mode: Specifies the blending mode for the multiple backgrounds. In this case, it's set to multiply.
background-origin: Specifies the positioning area of the background images. It's set to content-box.
background-clip: Specifies the painting area of the background. It's set to padding-box.
background-attachment: Specifies whether the background image is fixed or scrolls with the rest of the page. It's set to fixed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment