Basscss / Docs / Modules

Background Images

 

basscss-background-images v0.0.4 Optional

Background Images

Use the .bg-cover or .bg-contain utilities to control background size.

.bg-cover
<div class="p4 bg-cover" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-cover</code>
</div>

Use background position utilities to control position.

.bg-center

.bg-center
<div class="p4 bg-cover bg-center" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-center</code>
</div>

.bg-top

.bg-top
<div class="p4 bg-cover bg-top" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-top</code>
</div>

.bg-right

.bg-right
<div class="p4 bg-cover bg-right" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-right</code>
</div>

.bg-bottom

.bg-bottom
<div class="p4 bg-cover bg-bottom" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-bottom</code>
</div>

.bg-left

.bg-left
<div class="p4 bg-cover bg-left" style="background-image: url(/docs/placeholder.svg)">
  <code>.bg-left</code>
</div>