HTML <area> media attribute

คำอธิบายและวิธีใช้

media คุณสมบัตินี้กำหนดสื่อหรืออุปกรณ์ที่เอกสารที่มีลิงก์ตั้งแต่นั้นปรับปรุง

คุณสมบัตินี้ใช้เพื่อกำหนด URL ปลายทางที่ถูกทำเพื่ออุปกรณ์พิเศษ (เช่น iPhone) หรือสื่อเสียงหรือสื่อพิมพ์

คุณสมบัตินี้สามารถรับค่าหลายตัว

มีข้อกำหนด href 属性 ใช้

注意:คุณสมบัตินี้เป็นความแนะนำเพียงแค่นั้น

ตัวอย่าง

ใช้คุณสมบัติ media ในการกำหนดสื่อ/อุปกรณ์ปลายทางที่ต้องการปรับปรุง URL

<map name="planetmap"
  <area shape="rect" coords="0,0,114,576" alt="Sun"
  href="sun.html" media="screen and (min-color-index:256)"
</map>

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

การใช้งาน

<area media="value>

ตัวเลือกที่เป็นไปได้

ตัวเลือก คำอธิบาย
and กำหนดตัวเลือก AND
not กำหนดตัวเลือก NOT
, กำหนดตัวเลือก OR

อุปกรณ์

ค่า คำอธิบาย
all ค่าปริยาย
aural โปรแกรมสร้างเสียง
braille อุปกรณ์ตอบสนองข้อความประกาศเรียกดู
handheld อุปกรณ์หุ้มมือ (หน้าจอเล็ก, ช่องทางขนาดเล็ก)
projection เครื่องแบมเบิ้ล
print โมดูแบบเปิดให้พิมพ์/หน้าแสดงที่พิมพ์
screen หน้าจอคอมพิวเตอร์
tty เครื่องโทรสารหรือสื่อที่ใช้มิติตัวอักษรแบบมีขนาดเดียวกัน
tv อุปกรณ์ประเภทโทรทัศน์ (ต้นแบบ, ความสามารถในการเพิ่มหน้าแสดงจำกัด)

ค่า

ค่า คำอธิบาย
width

กำหนดความกว้างของพื้นที่แสดงเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (min-width:500px)"

height

กำหนดความสูงของพื้นที่แสดงเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (max-height:700px)"

device-width

กำหนดความกว้างของตัวแสดง/กระดาษเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (device-width:500px)"

device-height

กำหนดความสูงของตัวแสดง/กระดาษเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (device-height:500px)"

orientation

กำหนดทิศทางของตัวแสดง/กระดาษเป้าหมาย

ค่าที่เป็นไปได้: "portrait" หรือ "landscape"

ตัวอย่าง: media="all and (orientation: landscape)"

aspect-ratio

กำหนดอัตรากว้าง/สูงของพื้นที่แสดงเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (aspect-ratio:16/9)"

device-aspect-ratio

กำหนดอัตราด้านตัวแสดง/กระดาษ device-width/device-height

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (aspect-ratio:16/9)"

color

กำหนดจำนวนบิตของสีทุกสีของตัวแสดงเป้าหมาย

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (color:3)"

color-index

กำหนดจำนวนสีที่ตัวแสดงเป้าหมายสามารถจัดการได้

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (min-color-index:256)"

monochrome

กำหนดจำนวนบิตของแต่ละพิกเซลในบรรทัดเฟรมของภาพดำ

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="screen and (monochrome:2)"

resolution

กำหนดความหนาแน่นของพิกเซลของหน้าจอเป้าหมาย/กระดาษ (dpi หรือ dpcm)

สามารถใช้คำหน้า "min-" และ "max-"

ตัวอย่าง: media="print and (resolution:300dpi)"

scan

กำหนดวิธีสแกนของหน้าจอแท้วดิสเพลย์ TV

ค่าที่เป็นไปได้: "progressive" และ "interlace"

ตัวอย่าง: media="tv and (scan:interlace)"

grid

กำหนดอุปกรณ์ออกที่เป็นแนวแบบหรือแบบบิตมาพ

ค่าที่เป็นไปได้: "1" แสดงถึงแนวแบบ "0" แสดงถึงสิ่งอื่นๆ

ตัวอย่าง: media="handheld and (grid:1)"

การสนับสนุนเบราเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
การสนับสนุน การสนับสนุน การสนับสนุน การสนับสนุน การสนับสนุน