章节
问答
笔记
评论
占位
占位

Media Queries——媒体类型(一)

随着科学技术不断的向前发展,网页的浏览终端越来越多样化,用户可以通过:宽屏电视台式电脑笔记本电脑平板电脑智能手机来访问你的网站。尽管你无法保证一个网站在不同屏幕尺寸和不同设备上看起来完全一模一样,但至少要让你的Web页面能适配用户的终端,让他更好的呈现在你的用户面前。在本节中,将会学到如何使用CSS3中的Media Queries模块来让一个页面适应不同的终端(或屏幕尺寸),从而让你的页面让用户有一个更好的体验。

Media Queries

Media Queries是CSS3新增加的一个模块功能,其最大的特色就是通过CSS3来查询媒体,然后调用对应的样式。其实这个功能在CSS2.1中就有出现过,只不过那个时候此功能并不强大,我们最常见的就是给打印设备添加打印样式。随着时代的变化,这个模块功能越来越强大。

在彻底的了解Media Queries我们需要了解其中的两个重要部分,第一个是媒体类型,第二个是媒体特性。下面的内容我们简单的来了解这两个部分:

一、媒体类型

媒体类型(Media Type)在CSS2中是一个常见的属性,也是一个非常有用的属性,可以通过媒体类型对不同的设备指定不同的样式。

在CSS2中常碰到的就是all(全部)screen(屏幕)print(页面打印或打印预览模式),其实媒体类型远不止这三种,W3C总共列出了10种媒体类型。如下表所示:

设备类型

All

所有设备

Braille

盲人用点字法触觉回馈设备

Embossed

盲文打印机

Handheld

便携设备

Print

打印用纸或打印预览视图

Projection

各种投影设备

Screen

电脑显示器

Speech

语音或音频合成器

Tv

电视机类型设备

Tty

使用固定密度字母栅格的媒介,比如电传打字机和终端

其中ScreenAllPrint为最常见的三种媒体类型。

任务

本节无内容练习

?不会了怎么办
||

提问题

写笔记

截图
提交
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

举报

0/150
提交
取消
全部 精华 我要发布
全部 我要发布
最新 点赞
只看我的

手记推荐

更多

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?