Backgrounds

Background Attachment

Utilities for sets behaviour of background images when scrolling.


Class

classcss
bg-fixedbackground-attachment: fixed
bg-localbackground-attachment: local
bg-scrollbackground-attachment: scroll

Usage

Set fixed background image with HTML inline attribute style="..." and a CSS property background-image: url(...) to an element.

<!-- Example -->
<y class="bg-fixed ... w-56 h-24 overflow-y-scroll"
style="background-image:url(...)">
</y>

Set a scrollable background image in the browser viewport and the element container.

<!-- Example -->
<y class="bg-local ... w-56 h-24 overflow-y-scroll"
style="background-image:url(...)">
</y>

Set a scrollable background image in the browser viewport.

<!-- Example -->
<y class="bg-scroll ... w-56 h-24 overflow-y-scroll"
style="background-image:url(...)">
</y>

Variant

VariantEnabledResponsive
DefaultYes
Dark Theme
hover
group-hover
focus
focus-visible
focus-within
active
visited
checked
disabled