-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
cleaned index.html and added typography.html
- Loading branch information
Showing
2 changed files
with
156 additions
and
4 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,148 @@ | ||
| <!-- Bootstrap 4 starter template --> | ||
| <!doctype html> | ||
| <html lang="en"> | ||
| <head> | ||
| <!-- Required meta tags --> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | ||
|
|
||
| <!-- Bootstrap CSS --> | ||
| <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" | ||
| integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"> | ||
|
|
||
| <title>Typography!</title> | ||
| </head> | ||
| <body> | ||
| <!-- Start Here --> | ||
|
|
||
| <div class="container"> | ||
| <!-- Headings --> | ||
| <h1>Heading 1</h1> | ||
| <h2>Heading 2</h2> | ||
| <h3>Heading 3</h3> | ||
| <h4>Heading 4</h4> | ||
| <h5>Heading 5</h5> | ||
| <h6>Heading 6</h6> | ||
| <h6 class="h1">Heading 6 with class h1</h6> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Display Classes --> | ||
| <h1 class="display-1">Display-1</h1> | ||
| <h1 class="display-2">Display-2</h1> | ||
| <h1 class="display-3">Display-3</h1> | ||
| <h1 class="display-4">Display-4</h1> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Paragraphs --> | ||
| <p>Paragraph Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, alias aliquid animi aut beatae enim eveniet | ||
| fugit, ipsam itaque iure minima numquam quae quidem veniam vero voluptate voluptatibus. Blanditiis fugit maxime | ||
| nisi nostrum odit provident ratione! Animi commodi deserunt dicta facilis magnam, molestias mollitia possimus | ||
| ratione repellat suscipit veniam voluptates!</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Lead --> | ||
| <p class="lead">Paragraph with lead class Lorem ipsum dolor sit amet, consectetur adipisicing elit. Enim eveniet fugit odio perspiciatis suscipit. Eius | ||
| esse labore, laborum neque odit officia perferendis quae quaerat quia quibusdam quidem repellendus repudiandae | ||
| vero vitae voluptates. Debitis esse eum harum illum ipsa molestiae quas, vel voluptate? Consequatur eligendi | ||
| labore nulla praesentium qui tenetur vero.</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Monospace Paragraph --> | ||
| <p class="text-monospace">text-monospace</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Style classes --> | ||
| <p class="font-weight-bold">font-weight-bold</p> | ||
| <p class="font-weight-normal">font-weight-normal</p> | ||
| <p class="font-italic">font-italic</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Text Transforms --> | ||
| <p class="text-uppercase">text-uppercase</p> | ||
| <p class="text-lowercase">TEXT-LOWERCASE</p> | ||
| <p class="text-capitalize">text-capitalize</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Blockquotes --> | ||
| <blockquote class="blockquote"> | ||
| <p>This is a blockquote</p> | ||
| </blockquote> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Blockquote Right aligned --> | ||
| <blockquote class="blockquote text-right"> | ||
| <p>This is a blockquote aligned right</p> | ||
| </blockquote> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Blockquote Right aligned with Footer --> | ||
| <blockquote class="blockquote text-right"> | ||
| <p>This is a blockquote aligned right</p> | ||
| <footer class="blockquote-footer"> | ||
| Blockquote Footer | ||
| <cite title="Source Title">Source Title</cite> | ||
| </footer> | ||
| </blockquote> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Text Truncate --> | ||
| <p class="text-truncate">Text-truncate Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores culpa cupiditate | ||
| delectus dignissimos distinctio dolor dolorem dolores ducimus eius eveniet exercitationem explicabo fugiat id | ||
| illum ipsam iste itaque labore libero magnam magni maxime mollitia non nostrum nulla odit optio placeat provident | ||
| qui quos, repellendus repudiandae saepe tenetur vero? Excepturi, id!</p> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- Lists --> | ||
| <ul class="list-unstyled"> | ||
| <li>list-unstyled</li> | ||
| <li>list-unstyled</li> | ||
| <li>list-unstyled</li> | ||
| </ul> | ||
|
|
||
| <br> | ||
| <br> | ||
|
|
||
| <!-- List Inline --> | ||
| <ul class="list-inline"> | ||
| <li class="list-inline-item">list-inline</li> | ||
| <li class="list-inline-item">list-inline</li> | ||
| <li class="list-inline-item">list-inline</li> | ||
| </ul> | ||
|
|
||
| <!-- some space at the bottom --> | ||
| <div style="margin-top:200px;"></div> | ||
|
|
||
| </div> | ||
|
|
||
| <!-- Optional JavaScript --> | ||
| <!-- jQuery first, then Popper.js, then Bootstrap JS --> | ||
| <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" | ||
| integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" | ||
| integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script> | ||
| <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" | ||
| integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script> | ||
| </body> | ||
| </html> |