Panduan Lengkap Tabel Penurunan Harga: Sintaks, Pemformatan & Perataan Kolom

Pipa yang tidak sejajar dan karakter yang tidak lolos sering kali merusak rendering tabel penurunan harga di GitHub, Obsidian, dan situs dokumentasi statis. Sintaks tabel master, penanda perataan, dan konversi HTML dalam panduan praktis ini.

Structured markdown table syntax highlighting pipe delimiters and colon alignment markers alongside rendered table output

Sintaks Inti: Pipa & Tanda Hubung

Dalam ekstensi GitHub Flavored Markdown (GFM) dan CommonMark, tabel dibuat menggunakan dua karakter utama:

  • Pipa (|): Pisahkan kolom.
  • Tanda hubung (-): Tentukan baris pembatas header wajib.

Berikut adalah tabel penurunan harga minimum yang layak:

| Barang | Kategori | Harga |
| --- | --- | --- |
| apel | Buah | $1,00 |
| Roti | Toko Roti | $2,50 |

Baris kedua (baris pembatas) wajib. Tanpanya, pengurai penurunan harga akan memperlakukan teks sebagai paragraf biasa, bukan struktur tabel.

Mengontrol Perataan Kolom (Kiri, Tengah, Kanan)

Referensi penanda perataan kolom yang mengilustrasikan pemosisian teks kiri, tengah, dan kanan menggunakan penempatan titik dua

Anda dapat menentukan perataan teks di seluruh kolom dengan menempatkan titik dua (:) pada baris pembatas:

| Rata Kiri | Rata Tengah | Rata Kanan |
| :--- | :---: | ---: |
| Teks rata kiri | Teks di tengah | Angka rata kanan |
| Pendek | Panjang sedang | 1.492,00 |
  • Rata kiri (:---): Titik dua di sebelah kiri (perilaku default).
  • Rata tengah (:---:): Titik dua di kedua ujungnya.
  • Rata kanan (---:): Titik dua di sebelah kanan (ideal untuk mata uang, angka, dan tanggal).

Meloloskan Karakter Khusus di Dalam Sel

Panduan pelolosan karakter khusus yang menampilkan penggunaan garis miring terbalik untuk simbol pipa dan blok kode sebaris dalam sel tabel

Karena pipa (|) membatasi batas sel, menempatkan pipa literal di dalam teks Anda akan merusak tata letak tabel:


| Perintah | Aksi |
| aku | grep foo | Memfilter file |


| Perintah | Aksi |
| aku \| grep foo | Memfilter file |

Untuk menyisipkan jeda baris dalam satu sel, gunakan tag HTML
:

| Fitur | Detail |
| Kompresi | Mode rugi
Mode tanpa rugi |

Ubah dokumentasi penurunan harga Anda menjadi HTML semantik yang bersih secara instan dengan pengonversi Konverter Markdown ke HTML dari ToolDolfen.

Anatomi visual tabel penurunan harga yang menyorot pembatas header wajib, pemisah pipa, dan konten sel

Perbandingan antara tabel penurunan harga yang disejajarkan dengan spasi dan pemformatan pembatas mentah yang ringkas

Pratinjau konversi penurunan harga ke tabel HTML menampilkan gaya wrapper CSS responsif dan pengguliran horizontal seluler

Pertanyaan yang Sering Diajukan

Temukan jawaban cepat dan terverifikasi untuk pertanyaan umum tentang alur kerja ini.

Bagaimana Anda memasukkan pipa vertikal (|) ke dalam sel tabel penurunan harga?

Untuk merender simbol pipa di dalam sel tanpa merusak struktur kolom, gunakan entitas HTML | atau keluar dari karakter dengan garis miring terbalik sebelumnya (\|).

Apakah pipa kolom harus sejajar dengan sempurna agar penurunan harga dapat ditampilkan dengan benar?

Tidak. Pengurai penurunan harga mengabaikan spasi internal. Namun, menjaga pipa tetap sejajar secara vertikal dalam teks sumber Anda membuat git diffs dan penurunan harga mentah jauh lebih mudah dibaca dan ditinjau.

Bisakah Anda membuat paragraf atau daftar multi-baris di dalam sel tabel penurunan harga?

CommonMark Standar dan GitHub Flavored Markdown (GFM) tidak mendukung teks multi-baris di dalam sel tabel. Untuk menyisipkan jeda baris, masukkan tag HTML <br> yang eksplisit.

Bilal Ahmad