ข้อมูลอ้างอิงHTML

HTML โดยตัวอักษร HTML ตามหมวดหมู่ รองรับ HTML Browser แอตทริบิวต์ HTML HTML Global Attributes เหตุการณ์ HTML HTML สี HTML Canvas HTML เสียง/วิดีโอ ชุดอักขระ HTML HTML Doctypes การเข้ารหัส URL HTML รหัสภาษา HTML รหัสประเทศ HTML ข้อความ HTTP วิธี HTTP ตัวแปลง PX เป็น EM แป้นพิมพ์ลัด


HTML <p>แท็ก


ตัวอย่าง

ย่อหน้าถูกทำเครื่องหมายดังนี้:

<p>This is some text in a paragraph.</p>

ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง


ความหมายและการใช้งาน

แท็ ก<p>กำหนดย่อหน้า

เบราว์เซอร์จะเพิ่มบรรทัดว่างก่อนและหลังแต่ละ<p> องค์ประกอบโดยอัตโนมัติ

เคล็ดลับ:ใช้ CSS เพื่อจัด รูป แบบย่อหน้า


รองรับเบราว์เซอร์

Element
<p> Yes Yes Yes Yes Yes

คุณสมบัติสากล

แท็ ก<p>ยังสนับสนุน Global Attributes ในHTML


คุณสมบัติของเหตุการณ์

แท็ ก<p>ยังสนับสนุนแอตทริบิวต์เหตุการณ์ใน HTML



ตัวอย่างเพิ่มเติม

ตัวอย่าง

จัดข้อความในย่อหน้า (ด้วย CSS):

<p style="text-align:right">This is some text in a paragraph.</p>

ตัวอย่าง

ย่อหน้าสไตล์ด้วย CSS:

<html>
<head>
<style>
p {
  color: navy;
  text-indent: 30px;
  text-transform: uppercase;
}
</style>
</head>
<body>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

</body>
</html>

ตัวอย่าง

 เพิ่มเติมในย่อหน้า:

<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>

ตัวอย่าง

ปัญหาบทกวีใน HTML:

<p>
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.
</p>

หน้าที่เกี่ยวข้อง

กวดวิชา HTML: ย่อหน้า HTML

การอ้างอิง HTML DOM: Paragraph Object


การตั้งค่า CSS เริ่มต้น

เบราว์เซอร์ส่วนใหญ่จะแสดง<p>องค์ประกอบด้วยค่าเริ่มต้นดังต่อไปนี้:

ตัวอย่าง

p {
  display: block;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
}