📜  如何指定优化目标 URL 的媒体/设备?

📅  最后修改于: 2021-10-29 04:47:01             🧑  作者: Mango

HTML 的media 属性用于指定浏览器,链接文档针对哪些设备进行优化。此属性通常与 CSS 样式表一起使用,但也可用于简单的 HTML 构建的网页。该属性允许用户从多种设备中进行选择,并且可以接受多个值。此属性用于指定目标 URL 是为特殊设备(如 iPhone、Android 等)、语音或印刷媒体、投影仪、电视等设计的。

注意:只有当 href属性用作href指定链接文档时才能使用此属性,因此媒体属性用于指定链接文档将如何出现以及在哪些设备中出现并兼容。

我们可以指定的各种设备值如下:

Sl.No. VALUES DESCRIPTION
1. all

It is Default, if not specified.

It is most suited for all media type devices.

Syntax- Click here

2. screen 

It is used for the computer screens, smart-phones etc.

Syntax- Click here

3. speech 

It is used for the screen-readers that do “reads” the page out loud.

Syntax- Click here

4. print

It is used for the Print preview mode/printed page’s mode.

Syntax- Click here

5. tv 

It is used for Television type devices (low resolution, or the one with limited scroll ability).

Syntax- Click here

我们还可以在指定媒体设备类型的同时添加更多额外的特定信息,以显示链接文档将如何优化。

Sl.No. VALUE DESCRIPTION
1. width 

It is used to specify the width of the targeted media display area. 

Syntax- Click here

2. height

It is used to specify the height of the  targeted  media display area. 

Syntax- Click here

3. device-width  

It is used to specify the width of the targeted media  display area. .

Syntax- Click here

4. aspect-ratio

It is used to specify the width/height ratio of the targeted media  display area.  

Syntax- Click here

5. device-height 

It is used to specify the height of the target media  display/paper.

Syntax- Click here

6. orientation 

It is used to specify the orientation of the media device display/paper.

Syntax- Click here

7. device-aspect-ratio 

It is used to specify the device-width/device-height ratio of the media device display/paper. 

Syntax- Click here

8. color

 It is used to specify the bits per color of  media device display. 

Syntax- Click here

9. color-index 

It is used to specify the number of colors that media device display can support.

Syntax- Click here

10. resolution 

It is used to specify the pixel density of the media device display/paper. 

Syntax- Click here

句法:

下面是说明如何指定媒体属性的代码。

例子:

HTML


  

  

Welcome To GFG


        Click here      

    the code here in HTML sepcifies that the      link attached is valid for "ALL" media      devices and with aspect-ratio=16:9   

     


样本输出

Microsoft Edge 上的示例输出。