Press "Enter" to skip to content

Badges Example in Bootstrap CSS

Definition :

Badges are meant for providing notification kind of result to the web page.

Program :

<html>

   <head>

      <meta name=”viewport” content=”width=device-width” initial scale=”1″>

                  <link rel=”stylesheet” href=”https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css”>

                  <script src=”https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js”> </script>

                  <script src=”https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js”> </script>

    </head>

                <body>

                     <div class=”container”>

                                     <a href=”#”> NEWS <span class=”badge”> 5 </span> </a> </br>

                                                 <a href=”#”> MESSAGES <span class=”badge”> 45 </span> </a> </br>

                                                 <a href=”#”> LIKES <span class=”badge”> 15 </span> </a> </br>

                                                 <button type=”button” class=”btn btn-success”> SUCCESS <span class=”badge”> 100 </span> </button>

                                </div>

                </body>

</html>

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *