Main Page

Difference between revisions of "User:SynthSy/DingaRingDing"

From Arks-Visiphone
Jump to navigation Jump to search
Line 1: Line 1:
<ul class="list-group list-group-horizontal">
+
<dl class="row">
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.1</strong><br>10%</li>
+
<dt class="col-sm-3">Description lists</dt>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.2</strong><br>20%</li>
+
<dd class="col-sm-9">A description list is perfect for defining terms.</dd>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.3</strong><br>30%</li>
+
 
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.4</strong><br>40%</li>
+
<dt class="col-sm-3">Euismod</dt>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.5</strong><br>50%</li>
+
<dd class="col-sm-9">
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.6</strong><br>60%</li>
+
<p>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</p>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.7</strong><br>70%</li>
+
<p>Donec id elit non mi porta gravida at eget metus.</p>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.8</strong><br>80%</li>
+
</dd>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.9</strong><br>90%</li>
+
 
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.10</strong><br>100%</li>
+
<dt class="col-sm-3">Malesuada porta</dt>
</ul>
+
<dd class="col-sm-9">Etiam porta sem malesuada magna mollis euismod.</dd>
<ul class="list-group list-group-horizontal">
+
 
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.11</strong><br>10%</li>
+
<dt class="col-sm-3 text-truncate">Truncated term is truncated</dt>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.12</strong><br>20%</li>
+
<dd class="col-sm-9">Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</dd>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.13</strong><br>30%</li>
+
 
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.14</strong><br>40%</li>
+
<dt class="col-sm-3">Nesting</dt>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.15</strong><br>50%</li>
+
<dd class="col-sm-9">
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.16</strong><br>60%</li>
+
<dl class="row">
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.17</strong><br>70%</li>
+
<dt class="col-sm-4">Nested definition list</dt>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.18</strong><br>80%</li>
+
<dd class="col-sm-8">Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.</dd>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.19</strong><br>90%</li>
+
</dl>
<li class="list-group-item" style="background-color: black!important;"><strong>Lv.20</strong><br>100%</li>
+
</dd>
</ul>
+
</dl>

Revision as of 13:29, 20 April 2020

Description lists
A description list is perfect for defining terms.
Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Truncated term is truncated
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
Nesting
Nested definition list
Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.