Bootstrap Text
Bootstrap Tutorial » Bootstrap Text
Bootstrap text contains several elements for defining text with a special meaning.
This article explains the way how we use BS Text and it can be used as: text center, underline, classes, wrap, decoration, color, area, box, align middle, responsive, font size and more.
Bootstrap Text Alignment: Left aligned, Center, Right, Text size - example
Bootstrap Text: Left aligned, Center, Right, Text size
Easily realign text BS text alignment classes.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Text: Left aligned, Center, Right, Text size 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/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body><div class="container">
<h2>Bootstrap Text: Left aligned, Center, Right, Text size</h2>
<p class="text-left">Left aligned text on all viewport sizes.</p>
<p class="text-center">Center aligned text on all viewport sizes.</p>
<p class="text-right">Right aligned text on all viewport sizes.</p><p class="text-sm-left">Left aligned text on sized SM (small) or wider.</p>
<p class="text-md-left">Left aligned text on sized MD (medium) or wider.</p>
<p class="text-lg-left">Left aligned text on sized LG (large) or wider.</p>
<p class="text-xl-left">Left aligned text onsized XL (extra-large) or wider.</p>
</div></body>
</html>
Bootstrap Text Decoration - example
BS Text Decoration none, underline - class - example
Bootstrap CSS class text-decoration-none with source code and live preview. You can copy our examples and paste them into your project!
text decoration underline
Bootstrap class: .text-nowrap
Font weight and italics
<p class="font-weight-bolder">Bolder weight text (relative to the parent element).</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>
<p class="font-weight-lighter">Lighter weight text (relative to the parent element).</p>
<p class="font-italic">Italic text.</p>
bootstrap text center, underline, classes, wrap, decoration, color, area, box, align middle, responsive, font size
bootstrap text center, underline, classes, wrap, decoration, color, area, box, align middle, responsive, font size
Bootstrap Text - bootstrap
This tool makes it easy to create, adjust, and experiment with custom colors for the web.
Magnews2 is a modern and creative free magazine and news website template that will help you kick off your online project in style.
Find here examples of creative and unique website layouts.
Find here examples of creative and unique website CSS HTML menu.