สกัด HTML <body>

  • หน้าก่อนหน้า <blockquote>
  • หน้าต่อไป <br>

นิยามและการใช้งาน

<body> แท็ก body นิยามเนื้อหาหลักของเอกสาร

ข้อมูลเมตาและข้อมูลเอกสารของเอกสาร HTML ถูกล้อมรอบด้วยตัวแทน head และเนื้อหาของเอกสารถูกล้อมรอบด้วยตัวแทน body

ตัวแทน body มักจะตามหลังตัวแทน head อยู่ และเป็นลูกของตัวแทน html ตัวที่สอง

<body> ตัวแทน body มีส่วนทั้งหมดของเอกสาร HTML ตัวอย่างเช่น หัวข้อ ปารากราฟ รูปภาพ ลิงก์ ตาราง รายการ และอื่นๆ

จำเป็น:เอกสาร HTML สามารถมีตัวแทนเพียงหนึ่งตัวเท่านั้น <body> ตัวแทน

ตัวอย่าง

เอกสาร HTML ที่เรียบร้อยและเรียบร้อย:

<!DOCTYPE html>
<html>
  <head>
    <title>หัวข้อเอกสาร</title>
  </head>
  <body>
    <h1>นี่คือข้อหัว</h1>
    <p>นี่คือปารากราฟ</p>
  </body>
</html>

ทดสอบเลย

คำเตือน：สามารถดูตัวอย่างเพิ่มเติมที่ด้านล่างของหน้า

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

<body> แท็กตัวอย่างยังสนับสนุน คุณสมบัติโลกของ HTML。

คุณสมบัติเหตุ

<body> แท็กตัวอย่างยังสนับสนุน คุณสมบัติเหตุของ HTML。

ตั้งค่า CSS โดยเริ่มต้น

ส่วนใหญ่ของเบราเซอร์จะแสดงค่าเริ่มต้นตามตารางนี้ <body> ตัวแทน:

body {
  display: block;
  margin: 8px;
}
body:focus {
  outline: none;
}

ทดสอบเลย

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

ตัวอย่าง 1

เพิ่มรูปภาพพื้นหลังเข้าสู่เอกสาร (ใช้ CSS):

<html>
<head>
<style>
body {
  background-image: url(w3s.png);
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p><a href="">เข้าถึง codew3c.com!</a></p>
</body>

ทดสอบเลย

ตัวอย่าง 2

ตั้งค่าสีพื้นหลังของเอกสาร (ใช้ CSS):

<html>
<head>
<style>
body {
  background-color: #E6E6FA;
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p><a href="https://www.codew3c.com">เข้าถึง codew3c.com!</a></p>
</body>

ทดสอบเลย

ตัวอย่าง 3

ตั้งค่าสีของข้อความของเอกสาร (ใช้ CSS):

<html>
<head>
<style>
body {
  color: green;
}
</style>
</head>
<body>
<h1>Hello world!</h1>
<p>นี่คือข้อความ</p>
<p><a href="">เข้าถึง codew3c.com!</a></p>
</body>
</html>

ทดสอบเลย

ตัวอย่าง 4

ตั้งค่าสีของลิงก์ที่ยังไม่เคยเข้าเว็บเพื่อใช้ CSS:

<html>
<head>
<style>
a:link {
  color:#0000FF;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">การเรียนรู้ HTML</a></p>
</body>
</html>

ทดสอบเลย

ตัวอย่าง 5

ตั้งค่าสีของลิงก์ที่กำลังใช้งานเพื่อใช้ CSS:

<html>
<head>
<style>
a:active {
  color:#00FF00;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">การเรียนรู้ HTML</a></p>
</body>
</html>

ทดสอบเลย

ตัวอย่าง 6

ตั้งค่าสีของลิงก์ที่เคยเข้าเว็บเพื่อใช้ CSS:

<html>
<head>
<style>
a:visited {
  color:#FF0000;
}
</style>
</head>
<body>
<p><a href="https://www.codew3c.com">codew3c.com</a></p>
<p><a href="https://www.codew3c.com/html/">การเรียนรู้ HTML</a></p>
</body>
</html>

ทดสอบเลย

การสนับสนุนโปรแกรมบราวเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน
  • หน้าก่อนหน้า <blockquote>
  • หน้าต่อไป <br>