加入收藏 | 设为首页 | 会员中心 | 我要投稿 核心网 (https://www.hxwgxz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 创业 > 正文

CSS3 Media Queries,媒介设备查询

发布时间:2018-10-08 00:13:42 所属栏目:创业 来源:站长网
导读:允许通过 media 属性为不同媒介设备(如屏幕、打印机)指定专用样式表,而 CSS3 通过 media queries 使得更为行之有效。你可以为媒介类型添加某些查询条件用以检测设备,并采用不同的样式表。例如,你可以有一个大屏幕显示器的专用样式和一个移动设备的专用

大尺寸:导航在顶部,一排图片
中尺寸:导航在左侧,三列图片
小尺寸:导航在顶部,Logo 没有背景图片,三列图片

CSS3 Media Queries

Tee Gallery

这个和上述 Colly 案例非常相似,但是不同之处在于 Tee Gallery 中的图片会随着窗口尺寸变化弹性地自适应。这里的技巧是使用百分比宽度,而不使用固定像素宽度。

CSS3 Media Queries

总结

请记住:拥有优化过的移动版样式表并不意味着移动版网站的优化。真正的移动设备优化,图片和标记语言也必须被缩减到最小,Media queries 目的是为设计表现,而不是优化。

英文原稿:CSS3 Media Queries | WebDesignerWall
翻译整理:CSS3 Media Queries,媒介设备查询 | 芒果

(编辑:核心网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读