Font का Weight/Style
Weight और style utilities बिना किसी custom CSS के text को bold, light, या italic बनाती हैं।
In this page:
Syntax
<p class="fw-bold">bold</p>
<p class="fw-light">light</p>
<p class="fst-italic">italic</p>
Font Weight/Style
weight के लिए .fw-bold, .fw-semibold, .fw-normal, और .fw-light इस्तेमाल करें और style के लिए .fst-italic या .fst-normal। .text-decoration-none, .text-lowercase, और .text-uppercase decoration और case adjust करते हैं। .font-monospace class एक monospace font में switch करती है।
Note:
fw-bolder और fw-lighter parent के relative weight बदलते हैं।
उदाहरण: Font weight/style
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="p-3">
<div class="container">
<p class="fw-bold">Bold text</p>
<p class="fw-semibold">Semibold text</p>
<p class="fw-light">Light text</p>
<p class="fst-italic">Italic text</p>
<p class="text-uppercase fw-bold">uppercase and bold</p>
<p class="font-monospace">Monospace text</p>
</div>
</body>
</html>
Live Example
Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
आम गलतियां
- सिर्फ styling के लिए b और i tags इस्तेमाल करना
- inline CSS से override करना
- यह भूल जाना कि fst-italic style के लिए है
चैप्टर सारांश
- fw-bold, fw-semibold, fw-normal, fw-light classes मिलती हैं
- fst-italic और fst-normal
- Case और decoration utilities
- font-monospace भी उपलब्ध है
🔒
Chapter Quiz — Complete all 7 topics to unlock
0/7 topics done
Complete these topics first: