Markdown Toolbox Logo Markdown Toolbox
บ้าน
บล็อก

คู่มือไวยากรณ์ Markdown ของตาราง

2024-04-15

  • การจัดการอักขระพิเศษในตาราง Markdown
  • ความแปรผันของตาราง Markdown และแนวทางปฏิบัติที่ดีที่สุด
  • แบบฝึกหัด - ฝึกทักษะการสร้างตาราง Markdown
  • ภาคผนวก - คีย์บอร์ดลัดสำหรับการแก้ไขตาราง Markdown
  • บทสรุปและประเด็นสำคัญ
  • คำถามที่เกี่ยวข้อง

    คู่มือไวยากรณ์ Markdown ตาราง

    การสร้างตารางใน Markdown เป็นกระบวนการที่ตรงไปตรงมา ซึ่งช่วยเพิ่มการจัดระเบียบและการนำเสนอข้อมูลบนเว็บ ไกด์นี้ครอบคลุมทุกสิ่งที่คุณต้องรู้ ตั้งแต่ไวยากรณ์พื้นฐานไปจนถึงตัวเลือกการจัดรูปแบบขั้นสูง:

    • พื้นฐานของตาราง Markdown: ใช้ท่อ | และขีด - เพื่อสร้างตารางง่ายๆ
    • การจัดแนข้อความ: ควบคุมการจัดแนข้อความภายในเซลล์โดยใช้เครื่องหมายทวิภาค :.
    • การจัดรูปแบบภายในเซลล์: ใช้ตัวหนา ตัวเอียง ลิงก์ และโค้ดภายในเซลล์ของตาราง
    • การจัดการอักขระพิเศษ: เรียนรู้การรวมสัญลักษณ์เช่น & และ | โดยใช้เอนทิตี้ HTML หรือแบคสแลช
    • ความแปรผันและแนวทางปฏิบัติที่ดีที่สุด: สำรวจความแตกต่างในรสชาติของ Markdown และเคล็ดลับการสร้างตารางที่สะอาดขึ้น
    • เครื่องมือและแอพ: ค้นพบเครื่องมือและแอพพลิเคชั่นที่ทำให้การสร้างและแก้ไขตารางง่ายขึ้น

    เมื่อเสร็จสิ้นไกด์นี้ คุณจะได้รับความรู้ในการสร้างตารางที่ชัดเจนและมีข้อมูลใน Markdown ทำให้เนื้อหาของคุณมีโครงสร้างและเข้าถึงได้ง่ายขึ้น

    การจัดแนข้อความในตาราง Markdown

    คุณสามารถตัดสินใจว่าจะแนข้อความในคอลัมน์อย่างไร โดยการปรับแต่งแถวขีด -:

    • :---: = ข้อความจัดชิดไปทางซ้าย
    • :--: = ข้อความอยู่กึ่งกลาง
    • ---: = ข้อความจัดชิดไปทางขวา
    | ซ้าย | กึ่งกลาง | ขวา |
    | :--- | :----: | ----: |
    | ข้อความ | ข้อความ | ข้อความ |
    

    ตัวอย่าง:

    ซ้าย กึ่งกลาง ขวา
    ข้อความ ข้อความ ข้อความ

    การจัดรูปแบบข้อความในเซลล์ของตาราง Markdown

    คุณสามารถทำให้ข้อความเป็นตัวหนา ตัวเอียง เพิ่มลิงก์ หรือแม้แต่โค้ดภายในเซลล์ของตารางโดยใช้เทคนิค Markdown ปกติ:

    • ตัวหนา ด้วย ** หรือ __
    • ตัวเอียง ด้วย * หรือ _
    • ลิงก์เช่นตัวอย่าง
    • บล็อกโค้ดในบรรทัด

    ตัวอย่าง:

    ชื่อ คำอธิบาย
    จอห์น ครูที่ชอบ การเรียนรู้ สิ่งใหม่
    ซาร่าห์ วิศวกรที่ทำงานใน โครงการ ที่เจ๋ง

    นี่แสดงให้เห็นถึงพื้นฐานในการสร้างตารางใน Markdown ด้วยการฝึกฝนเล็กน้อย ตารางเหล่านี้สามารถเป็นวิธีที่ยอดเยี่ยมในการจัดระเบียบข้อมูลให้ชัดเจนสำหรับหน้าเว็บหรือเอกสาร

    การจัดการอักขระพิเศษในตาราง Markdown

    เมื่อคุณกำลังสร้างตารางใน Markdown บางครั้งคุณอาจต้องการรวมอักขระพิเศษที่รูปแบบ Markdown มักใช้เพื่อสิ่งอื่น ตัวอย่างเช่น เนื่องจาก Markdown ใช้ท่อ | เพื่อแยกคอลัมน์ หากคุณต้องการแสดงสัญลักษณ์ท่อภายในเซลล์ คุณจำเป็นต้องหาวิธีหลีกเลี่ยงเหตุการณ์นี้.

    มีวิธีสองสามวิธีในการทำเช่นนี้:

    เอนทิตี้อักขระ HTML

    วิธีหนึ่งคือการใช้เอนทิตี้อักขระ HTML เหล่านี้เป็นรหัสพิเศษที่ให้คุณแสดงอักขระที่มีความหมายอื่นใน HTML หรือ Markdown ตัวอย่างเช่น & สำหรับแอมเพอร์แซนด์ & และ | สำหรับท่อ |.

    นี่คือวิธีที่มันดู:

    อักขระ เอนทิตี้ ตัวอย่างการเรนเดอร์
    แอมเพอร์แซนด์ & R&D
    ท่อ | คอลัมน์|หัวข้อ

    คุณสามารถค้นหารายการ กลไกเอนทิตี้อักขระ HTML ได้ที่นี่.

    อักขระการหนีด้วย Backslash

    อีกวิธีหนึ่งคือใส่แบคสแลช \ ก่อนอักขระพิเศษ ซึ่งบอก Markdown ให้ปฏิบัติต่ออักขระถัดไปเหมือนกับข้อความตัวอื่น.

    \| = แสดงท่อ |
    \\ = แสดงแบคสแลช \
    

    แต่จดจำไว้ว่าการใช้แบคสแลชไม่ทำงานสำหรับอักขระทุกตัวในตาราง Markdown เช่น ท่อ |.

    บล็อกโค้ด

    สุดท้ายคุณสามารถใช้บล็อกโค้ด Markdown เพื่อแสดงอักขระพิเศษอย่างถูกต้อง โดยการใส่พวกมันในแบคติ๊ก `.

    ` | * | & | \ | | `` ``

    นี่จะดูเหมือน:

    * & \ `
    * & \ `

    โดยสรุป ใช้เอนทิตี้ HTML หรือแบคสแลชเมื่อคุณสามารถทำเพื่อหนีอักขระพิเศษ สำหรับท่อและสัญลักษณ์ที่มีปัญหาอื่นๆ บล็อกโค้ดเป็นวิธีที่ดีในการแสดงพวกเขาอย่างชัดเจน.

    ความแปรผันของตาราง Markdown และแนวทางปฏิบัติที่ดีที่สุด

    Markdown มีหลายสไตล์แต่ละอย่างมีวิธีการจัดการตารางของตัวเอง มาดูกันว่าเหล่านี้มีแนวทางอย่างไรบ้างและเคล็ดลับในการสร้างตารางที่ยอดเยี่ยม:

    GitHub Flavored Markdown (GFM)

    GFM เป็นสิ่งที่คุณเห็นใน GitHub ซึ่งทำให้คุณสามารถสร้างตารางได้อย่างง่ายดาย:

    | หัวข้อ 1 | หัวข้อ 2 |
    |----------|----------|
    | แถว 1a   | แถว 1b   |
    | แถว 2a   | แถว 2b   |
    

    คุณไม่จำเป็นต้องใส่ท่อ | ที่ปลายแต่ละบรรทัด แต่ก็ควรเพื่อหลีกเลี่ยงข้อผิดพลาด.

    MultiMarkdown และ Markdown Extra

    รุ่นเหล่านี้เพิ่มตัวเลือกเพิ่มเติมสำหรับตาราง เช่น การจัดแนข้อความ:

    | ขวา | ซ้าย | เริ่มต้น | กึ่งกลาง |
    |------:|:-----|---------|:-----:|
    |   12  |  12  |    12   |    12  |
    |  123  |  123 |   123   |   123  |
    

    ใช้เครื่องหมายทวิภาค : เพื่อควบคุมการจัดแนข้อความ.

    CommonMark

    CommonMark ไม่มีไวยากรณ์ตารางของตัวเอง คุณต้องใช้แท็ก HTML ในการสร้างตาราง.

    การละท่อ

    ใน GFM และสไตล์คล้ายกัน คุณไม่จำเป็นต้องมีท่อด้านข้าง |:

    หัวข้อ 1 | หัวข้อ 2
    --------- | ---------
    แถว 1a | แถว 1b
    แถว 2a | แถว 2b
    

    การไม่ใส่พวกมันอาจทำให้การแก้ไขง่ายขึ้น แต่การมีช่วยหลีกเลี่ยงข้อผิดพลาด.

    การปรับความกว้าง

    ลองจับคู่ความกว้างของคอลัมน์เพื่อทำให้ตารางของคุณดูเรียบร้อยขึ้น:

    | สั้น | คอลัมน์ตัวอย่างที่ยาวขึ้น |
    |-------|-----------------------|
    | ข้อความ  | ข้อความตัวอย่างเพิ่มเติม |
    

    นี่ทำให้ตารางของคุณอ่านง่ายขึ้น.

    เครื่องมือสร้างและแปลงตาราง Markdown

    การสร้างตารางจากศูนย์อาจเป็นเรื่องยาก นี่คือเครื่องมือบางส่วนที่ช่วย:

    เครื่องมือสร้างตาราง Markdown

    เครื่องมือสร้างตาราง Markdown ช่วยให้คุณสร้างตารางได้โดยไม่ต้องเขียนโค้ด เพียงกรอกข้อมูลของคุณและมันจะให้โค้ด.

    แปลงตาราง

    แปลงตาราง แปลงข้อมูลจากสเปรดชีตเป็นตาราง Markdown ได้อย่างรวดเร็ว.

    Typora

    ตัวแก้ไข Markdown Typora มีวิธีการง่ายในการเพิ่มและจัดรูปแบบตาราง.

    เครื่องมืออื่นๆ

    • Markdown Table Editor - เครื่องมือสำหรับ VSCode ที่ทำให้การแก้ไขตารางง่ายขึ้น.
    • Markdown All in One - ช่วยในการจัดรูปแบบตารางใน VSCode.

    การนำตาราง Markdown ไปใช้ในแอพ

    แอพบางตัวทำให้ง่ายต่อการทำงานกับตาราง Markdown:

    Typora

    Typora มีเมนูที่ง่ายในการเพิ่มและเปลี่ยนแปลงตาราง.

    Zettlr

    Zettlr ช่วยให้คุณแทรกตารางพื้นฐานแล้วแก้ไขได้โดยตรง.

    แอพอื่นๆ

    • iA Writer และ MacDown มีเครื่องมือช่วยเรื่องตาราง.
    • Bear มีเลย์เอาต์ที่สะอาดและปุ่มสำหรับตาราง.

    การรู้เคล็ดลับและเครื่องมือเหล่านี้สามารถทำให้การทำงานกับตาราง Markdown ง่ายขึ้นมาก อย่าลืมว่าจุดประสงค์คือการทำให้ข้อมูลชัดเจนและอ่านง่าย.

    แบบฝึกหัด - ฝึกทักษะการสร้างตาราง Markdown

    ให้เรามีการฝึกปฏิบัติกับการสร้างตารางด้วยการใช้ Markdown นี่คือแบบฝึกหัดง่ายๆ บางประการเพื่อช่วยให้คุณคุ้นเคย:

    แบบฝึกหัด 1 - สร้างตารางพื้นฐาน

    ก่อนอื่นมาสร้างตารางง่ายๆ ที่ระบุผลไม้ต่างๆ:

    • เริ่มด้วยแถวหัวเรื่องและตั้งชื่อคอลัมน์ของคุณ:
    | ผลไม้ | สี | รูปร่าง |
    
    • เพิ่มขีดใต้หัวข้อเพื่อแสดงตำแหน่งของคอลัมน์:
    | ผลไม้ | สี | รูปร่าง |
    | - | - | - |  
    
    • ตอนนี้เพิ่มผลไม้บางชนิดลงในตารางของคุณ:
    | ผลไม้ | สี | รูปร่าง |
    | - | - | - |
    | แอปเปิ้ล | แดง | กลม |
    
    • รวมผลไม้อีกสองชนิดที่คุณเลือก:
    | ผลไม้ | สี | รูปร่าง |
    | - | - | - | 
    | แอปเปิ้ล | แดง | กลม |
    | กล้วย | เหลือง | ยาว |
    | ส้ม | ส้ม | กลม |
    

    แบบฝึกหัด 2 - จัดรูปแบบข้อความในตาราง

    ถัดไป มาตกแต่งตารางผลไม้ของเรากัน:

    • ทำให้หัวข้อเป็นตัวหนาโดยการเพิ่ม ** รอบๆ:
    | **ผลไม้** | **สี** | **รูปร่าง** |
    | - | - | - |
    
    • ทำให้ "เหลือง" เป็นตัวเอียงสำหรับกล้วย:
    | กล้วย | *เหลือง* | ยาว |  
    
    • เปลี่ยน "ส้ม" เป็นลิงค์ที่แสดงสีของมันออนไลน์:
    | ส้ม | [ส้ม](https://www.w3schools.com/colors/colors_names.asp) | กลม |
    

    แบบฝึกหัด 3 - สร้างตารางที่ซับซ้อนมากขึ้น

    สำหรับความท้าทายเล็กน้อย มาสร้างตารางที่มีรายละเอียดมากขึ้น:

    • สร้างตารางสำหรับพนักงาน รวมชื่อ ตำแหน่ง และเงินเดือน:
    | **ชื่อ** | **ตำแหน่ง** | **เงินเดือน** |
    | - | - | - |
    
    • เพิ่มข้อมูลสำหรับพนักงาน 3 คนที่มีเงินเดือนต่างกัน:
    | **ชื่อ** | **ตำแหน่ง** | **เงินเดือน** |
    | - | - | - |
    | จอห์น | ผู้จัดการ | $80,000 |
    | ซาร่าห์ | นักพัฒนา | $60,000 |  
    | ลิซ่า | นักออกแบบ | $50,000 |
    
    • ตรวจสอบให้แน่ใจว่าคอลัมน์เงินเดือนถูกจัดให้ชิดขวา:
    | **ชื่อ** | **ตำแหน่ง** | **เงินเดือน** |
    | - | - | ---: |
    

    การฝึกด้วยขั้นตอนเหล่านี้เป็นวิธีที่ดีในการทำความคุ้นเคยกับการสร้างตาราง Markdown ลองสร้างตารางประเภทต่างๆ และเล่นกับการจัดรูปแบบเพื่อดูสิ่งที่คุณสามารถทำได้.

    sbb-itb-0cbb98c

    ภาคผนวก - คีย์บอร์ดลัดสำหรับการแก้ไขตาราง Markdown

    การแก้ไขตารางใน Markdown อาจเป็นเรื่องยาก แต่การรู้คีย์บอร์ดลัดบางตัวสามารถทำให้มันง่ายขึ้นมาก นี่คือรายชื่อคีย์ลัดที่ช่วยให้คุณทำงานได้เร็วขึ้น:

    • Tab - กระโดดไปยังเซลล์ถัดไป
    • Shift + Tab - กลับไปยังเซลล์ก่อนหน้า
    • Enter - ย้ายลงไปยังแถวถัดไป
    • Ctrl/Cmd + Enter - หยุดการแก้ไขตาราง
    • Ctrl/Cmd + ลูกศร - เคลื่อนที่ไปรอบๆ เซลล์ได้ง่าย

    การเปลี่ยนการจัดแนว

    • Ctrl/Cmd + l - ทำให้ข้อความจัดชิดไปทางซ้าย
    • Ctrl/Cmd + e - จัดกลางข้อความ
    • Ctrl/Cmd + r - จัดให้ข้อความชิดขวา
    • Ctrl/Cmd + . - ลบการจัดแนวที่เฉพาะเจาะจงใดๆ

    การแทรกและการลบ

    • Alt + i - เพิ่มแถวใหม่ด้านบน
    • Alt + a - เพิ่มแถวใหม่ด้านล่าง
    • Alt + j - เพิ่มคอลัมน์ทางซ้าย
    • Alt + l - เพิ่มคอลัมน์ทางขวา
    • Alt + Shift + i - ลบแถวปัจจุบัน
    • Alt + Shift + a - ลบแถวปัจจุบัน
    • Alt + Shift + j - ลบคอลัมน์ปัจจุบัน
    • Alt + Shift + l - ลบคอลัมน์ปัจจุบัน

    การเลือกและการเคลื่อนย้าย

    • Shift + ลูกศร - เลือกเซลล์เพิ่มเติม
    • Ctrl/Cmd + Alt + ลูกศร - เคลื่อนที่ทั้งแถวหรือคอลัมน์

    การทำความคุ้นเคยกับคีย์ลัดเหล่านี้สามารถช่วยให้คุณทำงานด้วยตารางใน Markdown ได้เร็วขึ้น เก็บคู่มือนี้ไว้สำหรับการอ้างอิงอย่างรวดเร็ว.

    บทสรุปและประเด็นสำคัญ

    การสร้างตารางด้วย Markdown ช่วยให้คุณจัดระเบียบข้อมูลได้อย่างเรียบร้อยสำหรับเว็บไซต์ มันค่อนข้างตรงไปตรงมาหากคุณเข้าใจอย่างแท้จริง ต่อไปนี้คือสิ่งที่ต้องจำ:

    • ในการสร้างคอลัมน์และแถว ใช้สัญลักษณ์ท่อ | วางขีด - ใต้แถวหัวเรื่องเพื่อแสดงว่าข้อความควรจัดเรียงอย่างไร
    • ในการจัดแนข้อความไปที่ซ้าย กึ่งกลาง หรือขวา เพียงแค่เพิ่มเครื่องหมายทวิภาค : ข้างๆ ขีดที่อยู่ใต้คอลัมน์ที่คุณต้องการปรับ
    • คุณสามารถทำให้ข้อความเป็นตัวหนา ตัวเอียง หรือเพิ่มลิงก์ในเซลล์ของตารางได้โดยใช้เทคนิค Markdown ปกติ
    • ตรวจสอบตัวอย่างใน GitHub Flavored Markdown (GFM) และ MultiMarkdown/Markdown Extra เพื่อเรียนรู้เคล็ดลับเพิ่มเติม
    • หากการสร้างตารางจากศูนย์รู้สึกยาก ใช้เครื่องมือต่างๆ เช่นเครื่องมือสร้างตารางหรือแปลงตารางบ่อยสามารถเปลี่ยนข้อมูลจากตาราง Excel เป็นตาราง Markdown ได้อย่างง่ายดาย
    • ลองทำแบบฝึกหัดเพื่อพัฒนาทักษะในการสร้างตาราง เริ่มต้นจากง่ายๆ แล้วลองเพิ่มรายละเอียดเพิ่มเติม
    • จำไว้ว่ามีคีย์บอร์ดลัดในโปรแกรม Markdown อย่าง Typora หรือ Zettlr ที่ช่วยให้คุณทำงานเร็วขึ้น

    เพียงแค่ฝึกฝนต่อไปและไม่นานการสร้างตาราง Markdown จะรู้สึกง่ายดาย อย่าลืมให้ตารางของคุณเรียบง่ายและชัดเจน จุดประสงค์หลักคือการแชร์ข้อมูลในลักษณะที่ทุกคนเข้าใจได้ง่าย ตาราง Markdown เหมาะสำหรับเรื่องนี้เพราะช่วยให้คุณจัดเรียงข้อมูลในรูปแบบที่เรียบร้อยและชัดเจน.

    คุณจะเขียนตารางใน Markdown ได้อย่างไร?

    ในการสร้างตารางใน Markdown ให้ใช้สัญลักษณ์ท่อ | เพื่อสร้างคอลัมน์ ขีด - เพื่อจัดเรียงข้อความใต้หัวเรื่อง และเครื่องหมายทวิภาค : เพื่อจัดให้ข้อความอยู่ทางซ้าย กึ่งกลาง หรือขวา เริ่มต้นด้วยหัวเรื่องในแถวแรก ขีดในแถวที่สองเพื่อกำหนดคอลัมน์ และจากนั้นเพิ่มข้อมูลของคุณด้านล่าง รักษาทุกอย่างให้เรียบร้อยเพื่อให้อ่านง่าย โปรแกรม Markdown บางตัวสามารถช่วยคุณจัดรูปแบบตารางได้ง่ายขึ้น.

    คุณจะจัดแนข้อความในตาราง Markdown ได้อย่างไร?

    ในการจัดแนข้อความในตาราง:

    • สำหรับการจัดชิดซ้าย: :---
    • สำหรับการจัดกลาง: :---:
    • สำหรับการจัดชิดขวา: ---:

    เพียงแค่เปลี่ยนแปลงขีดใต้คอลัมน์ที่คุณต้องการจัดเรียงในแถวที่สอง.

    คีย์ลัดสำหรับตาราง Markdown คืออะไร?

    โปรแกรม Markdown หลายตัว เช่น Typora หรือ Zettlr มีคีย์ลัดในการแทรกโครงสร้างตารางเปล่าอย่างรวดเร็ว ตัวอย่างเช่น ใน Typora บน Windows การกด Ctrl + T จะใส่ตารางเปล่าลงในเอกสารของคุณ ตรวจสอบคู่มือตัวแก้ไขของคุณสำหรับคีย์ลัดที่เฉพาะเจาะจง.

    คุณจะจัดระเบียบบล็อกโค้ดใน Markdown ได้อย่างไร?

    ในการจัดระเบียบบล็อกโค้ด ให้เพิ่มบรรทัดว่างก่อนและหลังโค้ด และจัดระเบียบแต่ละบรรทัดของโค้ดด้วยช่องว่างอย่างน้อย 4 ช่องหรือ 1 แท็บ วิธีนี้จะบอกให้ Markdown จัดรูปลักษณ์ในรูปแบบพิเศษ โดยทั่วไปจะมีฟอนต์ที่แตกต่างกันเพื่อทำให้สะดุดตาเป็นโค้ด.