ข้อมูลอ้างอิง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 <hr>แท็ก


ตัวอย่าง

ใช้แท็ก <hr> เพื่อกำหนดการเปลี่ยนแปลงเฉพาะเรื่องในเนื้อหา:

<h1>The Main Languages of the Web</h1>

<p>HTML is the standard markup language for creating Web pages. HTML describes the structure of a Web page, and consists of a series of elements. HTML elements tell the browser how to display the content.</p>

<hr>

<p>CSS is a language that describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work, because it can control the layout of multiple web pages all at once.</p>

<hr>

<p>JavaScript is the programming language of HTML and the Web. JavaScript can change HTML content and attribute values. JavaScript can change CSS. JavaScript can hide and show HTML elements, and more.</p>

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


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

แท็ ก<hr>กำหนดการแบ่งเฉพาะหน้าในหน้า HTML (เช่น การเปลี่ยนหัวข้อ)

องค์ประกอบ<hr>นี้มักแสดงเป็นกฎแนวนอนที่ใช้เพื่อแยกเนื้อหา (หรือกำหนดการเปลี่ยนแปลง) ในหน้า HTML


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

Element
<hr> Yes Yes Yes Yes Yes

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

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


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

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



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

ตัวอย่าง

จัดตำแหน่ง <hr> องค์ประกอบ (ด้วย CSS):

<hr style="width:50%;text-align:left;margin-left:0">

ตัวอย่าง

noshaded <hr> (พร้อม CSS):

<hr style="height:2px;border-width:0;color:gray;background-color:gray">

ตัวอย่าง

กำหนดความสูงของ <hr> องค์ประกอบ (ด้วย CSS):

<hr style="height:30px">

ตัวอย่าง

กำหนดความกว้างของ <hr> องค์ประกอบ (ด้วย CSS):

<hr style="width:50%">

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

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


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

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

ตัวอย่าง

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
}