Typography

Lorem Ipsum adalah contoh teks atau dummy dalam industri percetakan dan penataan huruf atau typesetting. Lorem Ipsum telah menjadi standar contoh teks sejak tahun 1500an, saat seorang tukang cetak yang tidak dikenal mengambil sebuah kumpulan teks dan mengacaknya untuk menjadi sebuah buku contoh huruf.

Saya Adalah Source-Code
<pre>
    <header>
        Saya Adalah Source-Code
    </header>
    <code>
        ....
    </code>
</pre>

Dan ini, adalah contoh Link yang muncul pada contoh penulisan pada postingan / tipografi.

Contoh Youtube ( Shortcode )

[youtube]https://www.youtube.com/watch?v=st4V-R05WIk[/youtube]

Contoh Penulisan :
[youtube]https://youtu.be/id_video[/youtube][/code]

Contoh Gambar pada Postingan + Keterangan

Contoh penggunaan Tag HTML <h2>

Contoh penggunaan Tag HTML <h3>

dan berikut adalah contoh penggunaan Tag HTML <blockquote>

Halo! saya adalah contoh tulisan yang ada dalam tag <blockquote>...</blocquote>, dan berikut adalah sorotan yang menggunakan Tag HTML <mark>

Contoh penggunaan Tag HTML <ul> / daftar biasa :

• Apakah Lorem Ipsum itu?
• Dari mana asalnya?
• Mengapa kita menggunakannya?
• Dari mana saya bisa mendapatkannya?

Contoh penggunaan Tag HTML <ol> / daftar dengan angka :

1. Baris pertama dari Lorem Ipsum, "Lorem ipsum dolor sit amet..", berasal dari sebuah baris di bagian 1.10.32.
2. Bagian standar dari teks Lorem Ipsum yang digunakan sejak tahun 1500an kini di reproduksi kembali di bawah ini untuk mereka yang tertarik.
3. Bagian 1.10.32 dan 1.10.33 dari "de Finibus Bonorum et Malorum" karya Cicero juga di reproduksi persis seperti bentuk aslinya, diikuti oleh versi bahasa Inggris yang berasal dari terjemahan tahun 1914 oleh H. Rackham.

Contoh Penggunaan Tag HTML <div class="table"><table>

Judul 1	Judul 2	Judul 3
Data	Data	Data
Data	Data	Data
Data	Data	Data
Data	Data	Data
Data	Data	Data

Contoh Penggunaan Tombol & Material Icon

Contoh Penulisan pada HTML
<a class='btn' href="#link">Tombol Biasa</a>

<a class='btn cta' href="#link">
  <i class='icon left'>whatsapp</i>
  Tombol CTA
</a>

berikut dengan tambahan class "block" untuk versi full width :

Contoh Penulisan pada HTML
<a class="btn block" href="#link">Tombol Biasa ( Full )</a>

<a class="btn block cta" href="#link">
  <i class="icon left">shopping_cart</i>
  Tombol CTA ( Full )
</a>

Contoh Penulisan pada HTML
<div class='btn-group'>
    <a class="btn block" href="#link">Demo</a>
    <a class="btn block cta" href="#link">
        <i class="icon left">download</i>
        Download
    </a>
</div>