写html这么久了,今天才发现link标签还有个media参数,赶紧把它补回来,虽然现在没有用到,但是不能不知道它

定义和用法

media 属性规定被链接文档将显示在什么设备上。

media 属性用于为不同的媒介类型规定不同的样式。

如果网页需要在不同终端设备上显示,比如打印时显示不同的排版格式,那就需要使用media参数了,比如:

<link type="text/css" rel="stylesheet" href="stylesheet.css" media="screen" />
<link type="text/css" rel="stylesheet" href="printstyle.css" media="print" />

上面的代码意思是说,当不打印的时候,使用media="screen"来显示网页,当打印的时候就调用printstyle.css来显示网页。

media的所有属性如下:

screen 计算机屏幕(默认)。
tty 电传打字机以及类似的使用等宽字符网格的媒介。
tv 电视机类型设备(低分辨率、有限的滚屏能力)。
projection 放映机。
handheld 手持设备(小屏幕、有限带宽)。
print 打印预览模式/打印页面。
braille 盲人点字法反馈设备。
aural 语音合成器。
all 适用于所有设备。

如果网页打印时与电脑上显示的是一个样式,那么你link里的media参数,可取值screen,也可以取值all。

HTML link标签media参数的更多相关文章

  1. html:<link> 标签中的 media 属性

    HTML <link> 标签的 media 属性 定义和用法 media 属性规定被链接文档将显示在什么设备上. media 属性用于为不同的媒介类型规定不同的样式. media属性值 ( ...

  2. (学习笔记)HTML的<link>标签

    在HTML中<link>标签用于定义文档与外部资源的关系. <link>标签只存在于head部分. <head> <link rel="styles ...

  3. 【131031】rel 属性 -- link标签中的rel属性,定义了文档与链接的关系

    此属性通常出现在a,link标签中 属性值 Alternate -- 定义交替出现的链接 Alternate 属性值 -- alternate是LinkTypes的一个值,网页设计者可以通过此值,设计 ...

  4. (转)Ratchet教程:meta与link标签

    原文:http://www.w3cplus.com/mobile/meta-and-link-tags-for-ratchet.html Ratchet教程:meta与link标签           ...

  5. 媒体查询media参数以及其兼容性问题

    一.设置meta标签 在使用媒体查询media之前我们需要先设置meta标签,对设备的缩放等参数进行设定. <!--设置缩放和绘制--> <meta name="viewp ...

  6. 使用link标签进行预加载

    概述 html中的link标签一般用来引入css文件.但是也可以通过rel属性来进行预加载.本文记录下相关方法,供以后开发时参考,相信对其他人也有用. 参考资料: mdn 通过rel="pr ...

  7. <link>标签的rel属性全解析

      <link>标签定义了当前文档与 Web 集合中其他文档的关系.link 元素是一个空元素,它仅包含属性.此元素只能存在于 head 部分,不过它可出现任何次数.在 HTML 中,&l ...

  8. link标签的rel属性

    <link>标签定义了当前文档与 Web 集合中其他文档的关系.link 元素是一个空元素,它仅包含属性.此元素只能存在于 head 部分,不过它可出现任何次数.在 HTML 中,< ...

  9. 移动端——link标签

    meta标签中提到了部分功能要结合link标签进行使用,link标签主要是存放CSS文件的地方,同时还有一些专属的移动端设置. <meta http-equiv="Content-Ty ...

随机推荐

  1. The Event System

    The Event System 在Qt中,事件是继承了虚拟类QEvent的对象,它代表了程序所发生的事情或者程序需要知道的一个外部活动的结果.事件可以被任意 QObject子类的实例接收和处理,是与 ...

  2. 使用Maven管理依赖JAR文件,自定义项目布局,利用ANT生成不同的发布包

    <?xml version="1.0" encoding="GB2312"?> <project name="CardInfo-We ...

  3. docker的网络-Container network interface(CNI)与Container network model(CNM)

    Overview 目前围绕着docker的网络,目前有两种比较主流的声音,docker主导的Container network model(CNM)和社区主导的Container network in ...

  4. OC之知识储备篇

    1. Objective-C是基于C语言的. a. 在C语言的基础之上新增了面向对象的语法. b. 将C语言中复杂的.繁琐的语法封装的更为简单. 2. Objective-C程序的源文件的后缀名.m  ...

  5. 办理多伦多大学(本科)学历认证『微信171922772』Toronto学位证成绩单使馆认证University of Toronto

    办理多伦多大学(本科)学历认证『微信171922772』Toronto学位证成绩单使馆认证University of Toronto Q.微信:171922772办理教育部国外学历学位认证海外大学毕业 ...

  6. STM32 Keil查看程序占用ROM和RAM

    1. 编译生成的map文件中code , RO ,RW, ZI 表示内容 Code为程序代码部分 RO-data 表示 程序定义的常量const temp; RW-data 表示 已初始化的全局变量 ...

  7. Kafka集群搭建

    1.zookeeper搭建 Kafka集群依赖zookeeper,需要提前搭建好zookeeper zookeeper快速搭建推荐地址:http://nileader.blog.51cto.com/1 ...

  8. Lua 数据类型和 Redis 数据类型之间转换

    当 Lua 通过 call() 或 pcall() 函数执行 Redis 命令的时候,命令的返回值会被转换成 Lua 数据结构. 同样地,当 Lua 脚本在 Redis 内置的解释器里运行时,Lua ...

  9. POI插件使用读取office文件

    html文件代码如下: <!doctype html> <html> <head> <meta charset="utf-8"> & ...

  10. RockMongo 安装

    1. yum install php-pecl-http php 2. yum install httpd 3. yum install php-devel 4. pecl install mongo ...