99 lines
3.1 KiB
HTML
99 lines
3.1 KiB
HTML
{% extends "components/base.html" %}
|
|
|
|
{% block title %}Landing Page{% endblock %}
|
|
|
|
{% block main_area %}
|
|
<article class="my-3" id="typography">
|
|
<div class="bd-heading sticky-xl-top align-self-start mt-5 mb-3 mt-xl-0 mb-xl-2">
|
|
<h3>Typography</h3>
|
|
<a class="d-flex align-items-center" href="/docs/5.1/content/typography/">Documentation</a>
|
|
</div>
|
|
|
|
<div>
|
|
<div class="bd-example">
|
|
<p class="display-1">Display 1</p>
|
|
<p class="display-2">Display 2</p>
|
|
<p class="display-3">Display 3</p>
|
|
<p class="display-4">Display 4</p>
|
|
<p class="display-5">Display 5</p>
|
|
<p class="display-6">Display 6</p>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<p class="h1">Heading 1</p>
|
|
<p class="h2">Heading 2</p>
|
|
<p class="h3">Heading 3</p>
|
|
<p class="h4">Heading 4</p>
|
|
<p class="h5">Heading 5</p>
|
|
<p class="h6">Heading 6</p>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<p class="lead">
|
|
This is a lead paragraph. It stands out from regular paragraphs.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<p>You can use the mark tag to
|
|
<mark>highlight</mark>
|
|
text.</p>
|
|
<p>
|
|
<del>This line of text is meant to be treated as deleted text.</del>
|
|
</p>
|
|
<p>
|
|
<s>This line of text is meant to be treated as no longer accurate.</s>
|
|
</p>
|
|
<p>
|
|
<ins>This line of text is meant to be treated as an addition to the document.</ins>
|
|
</p>
|
|
<p>
|
|
<u>This line of text will render as underlined.</u>
|
|
</p>
|
|
<p>
|
|
<small>This line of text is meant to be treated as fine print.</small>
|
|
</p>
|
|
<p>
|
|
<strong>This line rendered as bold text.</strong>
|
|
</p>
|
|
<p>
|
|
<em>This line rendered as italicized text.</em>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<blockquote class="blockquote">
|
|
<p>A well-known quote, contained in a blockquote element.</p>
|
|
<footer class="blockquote-footer">Someone famous in
|
|
<cite title="Source Title">Source Title</cite>
|
|
</footer>
|
|
</blockquote>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<ul class="list-unstyled">
|
|
<li>This is a list.</li>
|
|
<li>It appears completely unstyled.</li>
|
|
<li>Structurally, it's still a list.</li>
|
|
<li>However, this style only applies to immediate child elements.</li>
|
|
<li>Nested lists:
|
|
<ul>
|
|
<li>are unaffected by this style</li>
|
|
<li>will still show a bullet</li>
|
|
<li>and have appropriate left margin</li>
|
|
</ul>
|
|
</li>
|
|
<li>This may still come in handy in some situations.</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="bd-example">
|
|
<ul class="list-inline">
|
|
<li class="list-inline-item">This is a list item.</li>
|
|
<li class="list-inline-item">And another one.</li>
|
|
<li class="list-inline-item">But they're displayed inline.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
{% endblock %} |