Thuộc tính phương tiện HTML
Định nghĩa và Cách sử dụng
Thuộc mediatính chỉ định phương tiện / thiết bị mà tài liệu được liên kết được tối ưu hóa.
Thuộc tính này được sử dụng để chỉ định rằng URL mục tiêu được thiết kế cho các thiết bị đặc biệt (như iPhone), phương tiện nói hoặc phương tiện in.
Thuộc tính này có thể chấp nhận một số giá trị.
Áp dụng đối với
Thuộc mediatính có thể được sử dụng trên các phần tử sau:
| Các yếu tố | Thuộc tính |
|---|---|
| <a> | phương tiện truyền thông |
| <are Aaron | phương tiện truyền thông |
| <liên kết> | phương tiện truyền thông |
| <nguồn> | phương tiện truyền thông |
| <kiểu> | phương tiện truyền thông |
Các ví dụ
Một ví dụ
Một liên kết có thuộc tính media:
<a href="att_a_media.asp?output=print"
media="print and (resolution:300dpi)">
Open media attribute page for print.</a>
Ví dụ về khu vực
Một bản đồ hình ảnh, với một khu vực có thể nhấp:
<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun"
href="sun.htm" media="screen and (min-color-index:256)">
</map>
Ví dụ về liên kết
Hai trang định kiểu khác nhau cho hai loại phương tiện khác nhau (màn hình và bản in):
<head>
<link rel="stylesheet" type="text/css" href="theme.css">
<link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>
Ví dụ nguồn
Sử dụng thuộc tính media:
<source src="movie.ogg" type="video/ogg"
media="screen and (min-width:320px)">
Ví dụ về phong cách
Chỉ định kiểu để sử dụng cho bản in:
<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
Hỗ trợ trình duyệt
Thuộc mediatính này có hỗ trợ trình duyệt sau cho từng phần tử:
| Element | |||||
|---|---|---|---|---|---|
| a | Yes | Yes | Yes | Yes | Yes |
| area | Yes | Yes | Yes | Yes | Yes |
| link | Yes | Yes | Yes | Yes | Yes |
| source | Not supported | Not supported | Not supported | Not supported | Not supported |
| style | Yes | Yes | Yes | Yes | Yes |