HTML <img> คุณสมบัติ alt

HTML แบบแฟ้ม <img>

การระบุและการใช้งาน

alt คุณสมบัติเป็นคุณสมบัติที่จำเป็น มันกำหนดข้อความทางเลือกที่ใช้แทนภาพเมื่อภาพไม่สามารถแสดงได้

หากผู้ใช้ไม่สามารถดูภาพได้เนื่องจากสาเหตุดังนี้ คุณสมบัติ alt สามารถให้ข้อมูลทางเลือกแก่ภาพ

  • ระดับความเร็วเคลื่อนที่เร็วเกินไป
  • ข้อผิดพลาดในคุณสมบัติ src
  • บราวเซอร์ปิดการแสดงภาพ
  • ผู้ใช้ใช้สเครนเรดเดอร์

คุณสมบัติ alt ของแท็ก <img> กำหนดข้อความทางเลือกที่ใช้แทนภาพเมื่อภาพไม่สามารถแสดงได้ หรือเมื่อผู้ใช้ปิดการแสดงภาพ ในบราวเซอร์

เราแนะนำให้คุณใช้คุณสมบัตินี้ในทุกภาพในเอกสารของคุณ และด้วยนั้นแม้ว่าภาพไม่สามารถแสดงได้ ผู้ใช้ยังสามารถเห็นข้อมูลเกี่ยวกับสิ่งที่สูญเสียไปบางส่วน และสำหรับผู้ป่วยที่มีความพิการทางสมองนิสัย alt คุณสมบัตินี้เป็นวิธีเดียวที่พวกเขาสามารถตรวจสอบสิ่งที่มีในภาพ

คำเตือน:ถ้าต้องการสร้างคำเตือนสำหรับภาพ ใช้ คุณสมบัติ title！

คำเตือนและหมายเหตุ

หมายเหตุ:alt ค่าของคุณสมบัติเป็นตัวอักษรสายที่สามารถเก็บไว้ได้ 1024 ตัวอักษร ซึ่งรวมถึงช่องว่างและสัญลักษณ์ ตัวอักษรสายนี้จะต้องมีอยู่ในเครื่องหมายเปิดปิด ข้อความ alt นี้สามารถมีการอ้างอิงตัวเฉพาะของสัญลักษณ์พิเศษได้ แต่ไม่อนุญาตให้มีการใช้สัญลักษณ์แสดงรูปแบบอื่นๆ โดยเฉพาะไม่อนุญาตให้มีสัญลักษณ์แสดงรูปแบบสไตล์

หมายเหตุ:เมื่อผู้ใช้ย้ายเมาส์เหนือหลักฐาน img อินเทอร์เน็ตเอกซ์เพรสจะแสดงค่าของคุณสมบัติ alt นี้ การกระทำนี้ไม่ถูกต้อง ทุกบราวเซอร์อื่นๆกำลังเข้าร่วมมาตรฐาน และจะแสดงข้อความทางเลือกเมื่อภาพไม่สามารถแสดงได้

คำเตือน:ถ้าต้องการสร้างคำเตือนสำหรับภาพ ใช้ คุณสมบัติ title。

ตัวอย่าง

ตัวอย่าง 1

<img src="/i/eg_tulip.jpg" alt="上海鲜花港 - 郁金香" />

ทดลองด้วยตัวเอง

ถ้าไม่สามารถแสดงภาพได้ บราวเซอร์จะแสดงข้อความทางเลือก ซึ่งเหมือนกับนี้:

สวนดอกฮ่องหลาย - ทิวแบริส์

นอกจากนี้ ขณะที่คุณเคลื่อนที่เมาส์ขึ้นบนรูปภาพ บราวเซอร์ที่ใหม่ที่สุดจะแสดงข้อความรายละเอียดในกล่องข้อความ โค้ดนี้เพิ่มข้อความรายละเอียดในคุณสมบัติ alt ของรูปภาพ:

คุณสามารถเคลื่อนที่เมาส์ไปยังรูปภาพด้านล่างแล้วดูผลลัพธ์ที่เกิดขึ้น:

สวนดอกฮ่องหลาย - ทิวแบริส์

ข้อความที่หมุนเขตในวงกลมนี้คือผลที่ Internet Explorer 7 แสดงออกเมื่อคุณเคลื่อนที่เมาส์เหนือรูปภาพ:

สวนดอกฮ่องหลาย - ทิวแบริส์

ตัวอย่าง 2

รูปภาพที่กำหนดข้อความทางเลือก:

<img src="img_girl.jpg" alt="Girl in a jacket" width="500" height="600">

ทดลองด้วยตัวเอง

รูปแบบ

<img alt="text">

ค่าแบบภาพ

value รายละเอียด
text

กำหนดข้อความทางเลือกของรูปภาพ

หลักการใช้งานของ alt แบบภาพ:

  • ถ้ารูปภาพมีข้อมูล - ใช้ alt รายละเอียดรูปภาพ
  • ถ้ารูปภาพอยู่ในส่วน a ใช้ alt รายละเอียดลิงก์เป้าหมาย
  • ถ้ารูปภาพเพื่อการแสดงความงดงามเท่านั้น - ใช้ alt=""

การสนับสนุนโปรแกรมน่าเชื่อถือ

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน

HTML แบบแฟ้ม <img>