From the course: Bootstrap 4 Essential Training

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Shadows

Shadows - Bootstrap Tutorial

From the course: Bootstrap 4 Essential Training

Start my 1-month free trial

Shadows

- [Instructor] There's a few classes that allow you to add shadows to existing boxes. Now this is not going to work for text, only for box elements. So there are three shadow classes, shadow-sm, shadow, and shadow-lg, and they're just different sizes of the shadows and there's also a shadow-none class and that lets you remove a shadow from an existing element with a shadow. So let's take a look at how that works. It's pretty simple. Here we have some content with just a border and a little bit of padding around everything. Now this first one has a typical CSS shadow that I've added manually here with this style tag. So if I want to remove a shadow I can just add a shadow-none class and that will take care of taking out a shadow. So this'll work whether I'm actually using, say if I do a shadow class here, you'll notice that now I get the default shadow, which looks like this, and I can still, if I want to, programmatically add a shadow-none. And that's why a lot of these classes exist…

Contents