Global CSS
Explore how to apply global CSS styling in your Angular app by integrating the Bootstrap framework. Understand two methods to load Bootstrap CSS and how to update your project's configuration. Learn to enhance the visual appearance of your application before deployment without changing its core functionality.
We'll cover the following...
We have a functioning app, but it looks hideous. We’re going to be deploying the application so that the world can enjoy our fantastic little app. However, before we do, let’s add some styling to make it more presentable. Angular makes loading CSS into our app simple.
Installing Bootstrap
There are various CSS frameworks available. Any of them will work with Angular. Feel free to use whichever framework you prefer. This is not a CSS course. Hence, the reason we’ll be installing a framework to help us with CSS. It’s a quick and easy way to add some styles to an app.
For this app, we’ll be using Bootstrap. We’ll need to install it using the following command:
npm install bootstrap
The next thing we’ll do is import the Bootstrap CSS. There are two ways we can approach this.
Importing CSS
The first way is to use the ...