Bootstrap 4 Alerts

Bootstrap 4 Alerts

Bootstrap 4 offers alerts that are used to provide feedback messages on the user’s actions. There is no boundation of text length in the alerts.

Alerts can be created by using.alertclass. In addition, there are eight contextual classes of alerts which provide style to the alerts are given below:-

• .alert-success
• .alert-primary
• .alert-secondary
• .alert-danger
• .alert-warning
• .alert-Info
• .alert-light
• .alert-dark

Example

Output

Alert Links

Alert links are used to create links inside the alerts box. The color of those links and the color of the alert box will be similar. The.alert-linkclass is used to create alert links.

Example

Output

Closing Alerts

Closing alerts offer an “x” (closing button) option inside the alert box. When you click on x, it will close the alert message.

Steps for closing alert

• Add the.alert-dismissibleclass within the alert container.
• Addclass =”close”anddata-dismiss=”alert”intotag or link tag.

Example

01234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950

Output