dennogumi.org-archive/typography.md at b512f40ff00197c1a1161d54c5fe192ed0169fcd

Archived

This repository has been archived on 2021-01-06. You can view files and clone it, but cannot push or open issues or pull requests.

Moritz »mo.« Sauer dba5d71522 Release 0.5

This release changes the top Navigation into a white tipbar, extends
the documentation and uses some subtile changes.

2014-08-22 23:20:26 +02:00

6.2 KiB

Raw Blame History

layout

title

subtitle

description

image

permalink

page

Wonderful Typography

Reading Experience

<em>Feeling Responsive</em> uses Volkhov for headlines, Source Sans Pro for everything else and if you are in need to show some code, it will be in Lucida Console.

header
no

/design/typography/

Noch mehr Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Second <h2>-Heading

Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Third <h3>-Heading

Some Bulletpoints
Some Bulletpoints
Some Bulletpoints
Some Bulletpoints
Some Bulletpoints

Forth <h4>-Heading

Fifth <h5>-Heading

Typographical Elements

Here you'll find the complete list of HTML5-Tags and this is how they look like.

<hr> Horizontal Lines

<pre> Displaying Code

<html>
    <head>
        <title>Code Blocks</title>
    </head>
    <body></body>
</html>

<blockquote> Quotation

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<ol> Ordered Lists

Ordered List
Second List Item
Third List Item 4. Second Level First Item 4. Second Level Second Item 4. Second Level Third Item 5. And a third level First Item 5. And a third level Second Item 5. And a third level Third Item
Fourth List Item
Fifth List Item

<ul> Unordered Lists

Unordered List
Second List Item
Third List Item
- Second Level First Item
- Second Level Second Item
- Second Level Third Item
  - And a third level First Item
  - And a third level Second Item
  - And a third level Third Item
Fourth List Item
Fifth List Item

<dl> Definition Lists

Definition List: Bacon ipsum dolor sit amet spare ribs brisket ribeye, andouille sirloin bresaola frankfurter corned beef capicola bacon. Salami beef ribs sirloin, short loin hamburger shoulder t-bone.
Beef ribs jowl swine porchetta: Sirloin tenderloin swine frankfurter pork loin pork capicola ham hock strip steak ribeye beef ribs. Hamburger t-bone ribeye ham prosciutto bresaola.
Pancetta flank sirloin pork: short ribs shankle prosciutto landjaeger. Beef ribs turkey shoulder drumstick. Leberkas pork belly ribeye, bresaola jerky strip steak tenderloin bacon landjaeger short ribs beef ribs. Flank pork chop fatback tail kielbasa filet mignon jowl landjaeger bresaola tongue corned beef biltong. Landjaeger spare ribs fatback corned beef tenderloin drumstick, swine chicken beef turkey biltong doner tri-tip filet mignon.

<a>

Links make the web exceptional.

<em>

Let's emphasize how important responsive webdesign is.

<strong>

This looks like bold text.

<small>

This is small text.

<s>

<cite>

<q>

<dfn>

<abbr>

<time>

<code>

Some code: lucida console displayed.

<var>

<samp>

<kbd>

Copycats enjoy pressing CMD + c and CMD + v.

<sub>

This text _{lays low} and chills a bit.

<i>

<b>

<u>

<mark>

Let's mark this hint to give you a clue.

<br>

Need a break? I give you three!

Tables

<table> <caption> <colgroup> <col> <tbody> <thead>Tabellenspalten enthalten. <tfoot>Tabellenspalten enthalten. <tr> Steht für eine Zeile mit Tabellenzellen. <td> Kennzeichnet eine einzelne Tabellenzelle. <th>

6.2 KiB Raw Blame History