Upgrade to Pro — share decks privately, control downloads, hide ads and more …

MediaQuery适配

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for Thinking80s Thinking80s
January 10, 2013
0
210

 MediaQuery适配

Avatar for Thinking80s

Thinking80s

January 10, 2013
Tweet

More Decks by Thinking80s

See All by Thinking80s
响应式设计案例
Avatar for Thinking80s dengpeng
0
190
响应式设计
Avatar for Thinking80s dengpeng
0
160

Featured

See All Featured
We Are The Robots
Avatar for Honza Javorek honzajavorek
0
160
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
71k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
430
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
0
160
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
182
10k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
55k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
54
8k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
122
21k
Designing for Performance
Avatar for Lara Hogan lara
610
70k

Transcript

  1. Media Query适配尺寸

  2. media type • IE5.5/6/7不支持在@import中使用媒体类型 • Safari/firefox只支持all,screen,print三种类型 (包括iphone) • Opera 完全支持

    • Opera mini 支持handheld，未指定则使用 screen • Windows Mobile系统中的IE支持handheld，

  3. media query • media query是CSS 3对media type的增强，事 实上我们可以将media query看成是media type+css属性判断

  4. None
  5. None
  6. None
  7. None

  8. 参考 • http://xxlovexx.cn/post/2012-05- 18/21720537 • http://pugetworks.com/blog/2011/04/css- media-queries-for-targeting-different-mobile- devices/ • http://www.javascriptkit.com/dhtmltutors/css

    mediaqueries2.shtml • http://www.qianduan.net/media-type-and- media-query.html