Tipografi

  •  
Tipografi

Tipografi


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.


Contoh Penulisan Source Code

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://youtu.be/HLDCrPrllyc[/youtube]

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

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

Tombol Biasa  Tombol CTA
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 :


Tombol Biasa ( Full )
Tombol CTA ( Full )
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>

dan berikut dengan tambahan container "btn-group" untuk membuat grup tombol :

Left Center Right

Demo Download 

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>
Tambahkan Komentar