วิธีใช้แท็ก blockquote สำหรับยกข้อความยาวใน HTML

แท็ก <blockquote> ใช้สำหรับยกข้อความจากแหล่งอื่นที่มีความยาว (block-level quotation) ต่างจาก <q> ที่ใช้สำหรับยกข้อความสั้น inline

คุณสมบัติ

ต้องมีเนื้อหาเป็น block-level elements เท่านั้น (ไม่ใช่ plain text โดยตรง)
มี attribute cite ระบุ URL แหล่งที่มาของข้อความที่ยกมา
Browser จะจัดให้มี margin ด้านซ้าย/ขวาโดยอัตโนมัติ

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
  <title>HTML blockquote tag</title>
</head>
<body>
  <h1>Drupal</h1>
  <p>Here is a quotation from Drupal's official website</p>
  <blockquote cite="https://drupal.org">
    The Drupal project is open source software. Anyone can download, use, work on, and share it with others. It's built on principles like collaboration, globalism, and innovation.
  </blockquote>
</body>
</html>

แนวทางปฏิบัติที่ดี

ควรใส่ <p> หรือ <div> ครอบข้อความภายใน blockquote
ใช้ cite attribute เพื่ออ้างอิงแหล่งที่มาอย่างถูกต้อง
สำหรับการยกข้อความสั้นในบรรทัดเดียว ให้ใช้ <q> แทน