Bootstrap class to emphasize text

Bootstrap Web Development CSS Framework

HTML's default emphasis tags such as <small> sets text at 85% the size of the parent, <strong> emphasizes a text with heavier font-weight, and <em> emphasizes a text in italics.

You can try to run the following code to an emphasis on text −

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap emphasis tags</title>
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
   </head>
   <body>
      <small>This content is within tag</small><br>
      <strong>This content is within tag</strong><br>
      <em>This content is within tag and is rendered as italics</em><br>
      <p class = "text-left">Left aligned text.</p>
      <p class = "text-center">Center aligned text.</p>
      <p class = "text-right">Right aligned text.</p>
      <p class = "text-muted">This content is muted</p>
      <p class = "text-primary">This content carries a primary class</p>
      <p class = "text-danger">This content carries a danger class</p>
   </body>
</html>

Ankith Reddy

Updated on: 12-Jun-2020

741 Views

Kickstart Your Career

Get certified by completing the course

Get Started