
HTML Paragraphs การทำย่อหน้าในเอชทีเอ็มแอล
ในภาษา HTML เราสามารถขึ้นย่อหน้าใหม่ได้โดยใช้แท็ก <p> ซึ่งมีรูปแบบการใช้งานดังนี้
<p>This is a paragraph. นี่คือย่อหน้านะครับ</p> <p>This is another paragraph. นี่คืออีกย่อหน้าหนึ่งนะครับ</p>
แต่เราจะไม่สามารถกำหนดได้ว่า ผลลัพธ์จะให้ออกมาแบบที่เราต้องการ เช่น เราขึ้นบรรทัดใหม่ หรือจัดรูปแบบข้อความในย่อหน้ามาอย่างดี รูปแบบเหล่านั้นจะถูกตัดออกหมด เช่น
<p> This paragraph contains a lot of lines in the source code, but the browser ignores it. </p> <p> This paragraph contains a lot of spaces in the source code, but the browser ignores it. </p>
ผลลัพธ์

จากตัวอย่าง ถึงแม้ว่าเราจะจัดรูปแบบให้แสดงข้อความมีการเว้นวรรค มีการขึ้นบรรทัดใหม่ แต่เวลาแสดงผล การจัดรูปแบบเหล่านั้นจะถูกตัดออกทั้งหมด และข้อความจะถูกแสดงอยู่ในแถวเดียวกัน
HTML Line Breaks การขึ้นบันทัดใหม่
ถ้าต้องการขึ้นบรรทัดใหม่ในย่อหน้าเดียวกัน ให้ใช้แท็ก <br> หรือ <br /> ดังนี้
<p> This paragraph <br> contains a lot of lines<br> in the source code,<br> but the browser<br> ignores it.<br> </p>
ผลลัพธ์

จากตัวอย่าง เมื่อเราใช้แท็ก <br> ข้อความจะขึ้นบรรทัดใหม่ตามที่เราต้องการได้อย่างถูกต้อง
การจัดรูปแบบด้วยแท็ก <pre>
จากปัญหาที่เกิดขึ้นเมื่อใช้แท็ก <p> คือ อักขระพิเศษ การจัดวรรตอน การขึ้นบรรทัดใหม่ จะถูกลบลิ้งหมด และจะแสดงข้อความทั้งหมดเป็นบรรทัดเดียวกันโดยอัตโนมัติ ทำให้บางทีมีปัญหา เช่น การเขียนบทกลอน ที่ต้องมีการขึ้นบรรทัดใหม่อยู่เรื่อย ๆ เป็นบาท ๆ ไป
เราสามารถแก้ปัญหานี้ได้โดยการใช้แท็ก <pre> ดังนี้
<pre> My Bonnie lies over the ocean. My Bonnie lies over the sea. My Bonnie lies over the ocean. Oh, bring back my Bonnie to me. </pre>

เมื่อใช้แท็ก <pre> ข้อความจะถูกจัดรูปแบบตามที่เราต้องการ