White background class in Bootstrap

White background class in Bootstrap

I’m searching for a class that makes the element a white background.
maybe something like .bg-white, I couldn’t find it in Bootstrap but maybe its hidden somewhere?

Solutions/Answers:

Solution 1:

Since Bootstrap 4, Bootstrap does have white, light and dark background classes.

HTML:

<div class="bg-light text-dark">Light background</div>
<div class="bg-dark text-white">Dark background</div>
<div class="bg-white text-dark">White background</div>

Source : Background Color – Bootstrap Docs

Solution 2:

Bootstrap doesn’t have a white background class.

Create your own:

.white-bg{
    background:#ffffff !important;
}

This can be placed in bootstrap.css or your own custom stylesheet if you’ve created one.

The only backgrounds there are in bootstrap are:

.bg-primary
.bg-success
.bg-info
.bg-warning
.bg-danger

Source: Bootstrap website

Solution 3:

You would have to define such class yourself. Put the following in your custom CSS file.

CSS:

.bg-white {
    background-color: #ffffff !important;
}

In Bootstrap you have the following pre-defined backgrounds:

Bootstrap 3.1.0:

<div class="bg-primary">...</div>
<div class="bg-success">...</div>
<div class="bg-info">...</div>
<div class="bg-warning">...</div>
<div class="bg-danger">...</div>

Bootstrap 3.0.3:

<div class="alert alert-success">...</div>
<div class="alert alert-info">...</div>
<div class="alert alert-warning">...</div>
<div class="alert alert-danger">...</div>
Related:  load iframe in bootstrap modal

Solution 4:

I haven’t seen any style in bootstrap only for white-background. So apply yourself.

Add a class bg-white to your html element. Then in apply the background style.

.bg-white{
    background:#ffffff;
}

Example

<div class="bg-white">      
  <!-- div contents go here -->
</div>

References