forked from noalfemminicidio/noalfemminicidio.github.io
-
Notifications
You must be signed in to change notification settings - Fork 137
/
typography.html
119 lines (106 loc) · 5.96 KB
/
typography.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
---
layout: index
title: Typography
tagline: A sample page for landing pages and apps, try yourself!
tags : [typography, components]
img :
img-mobile :
author : Antonio Trento
css:
js:
keywords: components, demo
canonical: https://heliumjk.github.io
---
{% include JB/setup %}
<!-- Content Area Start -->
<div id="content">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="page-header-title">
<h2 class="heading-title text-center">Typography</h2>
</div>
<div class="row">
<!-- headings -->
<div class="col-md-3 col-sm-6">
<h4 class="sub-title">Headings</h4>
<h1>H1 Heading</h1>
<h2>H2 Heading</h2>
<h3>H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H5 Heading</h5>
<h6>H6 Heading</h6>
</div>
<!-- paragraphs -->
<div class="col-md-5 col-sm-6">
<h4 class="sub-title">Paragraphs</h4>
<p class="lead"><strong>Large Paragraph:</strong> But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system</p>
<p><strong>Regular Paragraph:</strong> But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system</p>
<p class="text-sm"><strong>Small Paragraph:</strong> But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system</p>
<p class="text-xs"><strong>Extra Small Paragraph:</strong> But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system</p>
</div>
<!-- lists -->
<div class="col-md-4 col-sm-6">
<h4 class="sub-title">Lists</h4>
<ul class="list-featured space-bottom-20">
<li>Far far away, behind the word mountains</li>
<li>Hen she reached the first hills</li>
<li>Vestibulum nisi nibh, pulvinar sit amet lacinia</li>
<li>Mauris pretium elit ac facilisis mollis posuere</li>
<li>Mauris vitae magna in dolor porta aliquam</li>
</ul>
<ol>
<li>Far far away, behind the word mountains</li>
<li>Morbi quis neque non nisl egestas laoreet</li>
<li>Vestibulum nisi nibh, pulvinar sit amet</li>
<li>Mauris pretium elit ac facilisis mollis</li>
<li>Mauris vitae magna in dolor porta aliquam</li>
</ol>
</div>
</div>
<div class="mb-60"></div>
<div class="row">
<!-- text colors -->
<div class="col-sm-5">
<h4 class="sub-title">Text Colors</h4>
<p><strong>Default</strong>. Aliquam molestie quam in tincidunt accumsan</p>
<p class="text-primary"><strong>Primary</strong>. Morbi quis neque non nisl egestas laoreet</p>
<p class="text-success"><strong>Success</strong>. Vestibulum nisi nibh, pulvinar sit amet lacinia</p>
<p class="text-info"><strong>Info</strong>. Mauris pretium elit ac facilisis mollis posuere</p>
<p class="text-warning"><strong>Warning</strong>. Mauris vitae magna in dolor porta aliquam</p>
<p class="text-danger"><strong>Danger</strong>. Mauris vitae magna in dolor porta aliquam</p>
</div>
<!-- text backgrounds -->
<div class="col-sm-7">
<h4 class="sub-title">Text Backgrounds</h4>
<p class="line-height-36"><span class="bg-default">Hello</span> nisl vitae ligula volutpat, sit amet rhoncus nisl posuere. Vestibulum vel nisi euismod, <span class="bg-primary">Mountains</span> fringilla ex. Fusce vel mattis quam, id bibendum leo. Vivamus sollicitudin ligula ut ante bibendum, et <span class="bg-success">Cool.</span> Interdum et malesuada <span class="bg-info">Kit</span> ipsum primis in faucibus. Praesent laoreet ultrices tortor <span class="bg-warning">Chill</span> Vestibulum quis egestas mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, <span class="bg-danger">No</span> himenaeos.</p>
</div>
</div>
<div class="mb-60"></div>
<h2 class="heading-title ">Simple Title</h2>
<h4 class="sub-title">Simple Sub-title</h4>
<!-- blockquotes -->
<div class="row">
<div class="col-sm-6">
<h4 class="sub-title">Blockquotes</h4>
<blockquote>
<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia. Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
<cite>- Michaeal Sam</cite>
</blockquote>
</div>
<div class="col-sm-6">
<h4 class="sub-title"> </h4>
<blockquote class="blockquote-reverse">
<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia. Far far away, behind the word mountains, far from the countries Vokalia and Consonantia</p>
<cite>- John Doe</cite>
</blockquote>
</div>
</div>
<!-- End blockquotes -->
<div class="mb-60"></div>
</div>
</div>
</div>
</div>
<!-- Content Area End -->
<div class="text-center">Love this UI Kit? Get more Free and Premium <a href="https://uideck.com/products/category/ui-kits/">Bootstrap UI Kits</a> </div>