Home Whiteboard Graphing Calculator Online Compilers Articles Tools
Tutorials Courses Jobs

Item text inside the list group in Bootstrap

Bootstrap Web Development CSS Framework

To set item text inside the list group, use the .list-group-item-text class.

You can try to run the following code to implement the .list-group-item-text class −

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
      <script src = "/scripts/jquery.min.js"></script>
      <script src = "/bootstrap/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class = "container">
         <h1>Cars</h1>
         <ul class = "list-group">
            <li class = "list-group-item">
               <h3 class = "list-group-item-heading">Hyundai</h3>
               <p class = "list-group-item-text">i10</p>
               <p class = "list-group-item-text">i20</p>
            </li>
            <li class = "list-group-item">
               <h3 class = "list-group-item-heading">Volkswagen</h3>
               <p class = "list-group-item-text"></p>
               <p class = "list-group-item-text">Vento</p>
               <p class = "list-group-item-text">Polo</p>
            </li>
         </ul>
      </div>
   </body>
</html>
Updated on: 2020-06-15T06:39:35+05:30

316 Views

Learn More in Our Tutorials

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements