Typography, Writing Style, Formatting, Attribute, etc

Table of Content

List Style

List style dengan nomor

1. Daftar pertama
2. Daftar kedua
3. Daftar ketiga
4. Daftar Keempat

List style dengan dots

• Daftar pertama
• Daftar kedua
• Daftar ketiga
• Daftar Keempat

List style dengan nested

1. Satu
1. Satu satu
1. Satu satu satu
2. Dua
3. Tiga

Blockquote

Debugging itu adalah sebuah metode yang dilakukan oleh para programmer untuk mencari jarum di tumpukan jerami. Harly Umboh

Dropcap

Drop cap adalah huruf kapital besar yang digunakan sebagai elemen dekoratif di awal paragraf atau bagian.

<p><span class='dropcap'>Y</span>our text goes here</p>

Syntax Highlighter

// Untuk menggunakan Syntax Highlighter penulisannya adalah seperti ini
<pre><code>
  <!-- kode html, css ata javascript disini -->
</code></pre>

Table

No	Nama Kota	Laki-laki	Perempuan	Jumlah Penduduk
1	Jatinangor	57.332	55.902	113.234
2	Tanjungsari	41.131	39.236	80.367
3	Rancakalong	19.564	19.419	38.983
4	Sumedang Utara	45.174	51.107	96.281

<div class="table">
  <table>
    <thead>
      <tr>
        <th>No</th>
        <th>Nama Kota</th>
        <th>Laki-laki</th>
        <th>Perempuan</th>
        <th>Jumlah Penduduk</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>Jatinangor</td>
        <td>57.332</td>
        <td>55.902</td>
        <td>113.234</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Tanjungsari</td>
        <td>41.131</td>
        <td>39.236</td>
        <td>80.367</td>
      </tr>
      <tr>
        <td>3</td>
        <td>Rancakalong</td>
        <td>19.564</td>
        <td>19.419</td>
        <td>38.983</td>
      </tr>
      <tr>
        <td>4</td>
        <td>Sumedang Utara</td>
        <td>45.174</td>
        <td>51.107</td>
        <td>96.281</td>
      </tr>
    </tbody>
  </table>
</div>

Button

Button

<a class='button' href='Url_anda_disni'>Button</a>

Gambar Bagi Dua

<div class='split-2'>Your_Image</div>

Gambar Bagi Tiga

<div class='split-3'>Your_Image</div>

Gambar Bagi Empat

<div class='split-4'>Your_Image</div>

Gambar Grid

<div class='gridImage'>Your_Image</div>

Gambar Scroll

<div class='scrollImage'>Your_Image</div>