What is an alerts in bootstrap? Where it has been used?

0 votes
Ethan Karla asked 28-Jul-2021 in Web Application by Ethan Karla

What is an alerts in bootstrap? Where it has been used?

1 Answer

0 votes
Ravi Vishwakarma answered 12-Aug-2021 by Ravi Vishwakarma

We are discussing the alert box. Many times we see the client that the client enters the data in the input field in the HTML page incorrectly, so as a programmer, we should show him an alert message. That's why alert boxes are used. Alert class is used to create alert boxes in Bootstrap.

Alerts are created with the .alert class, followed by one of the contextual classes .alert-success, .alert-info, .alert-warning, .alert-danger, .alert-primary, .alert-secondary, .alert-light or .alert-dark.


<!DOCTYPE html>

<html lang='en'>
    <title>Bootstrap Example</title>
    <meta charset='utf-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
    <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css'>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js'></script>
    <script src='https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js'></script>
    <div class='container'>
        <div class='alert alert-success'>
            <strong>Success!</strong> this is alert box
        <div class='alert alert-primary'>
            <strong>Success!</strong> You should visite <a href='https://www.mindstick.com/' class='alert-link' target='_blank'>www.mindstick.com</a>.
        <div class='alert alert-danger alert-dismissible'>
            <button type='button' class='close' data-dismiss='alert'>&times;</button>
            <strong>Error !!!</strong> read message and close it.


What is an alerts in bootstrap? Where it has been used?