代码拉取完成,页面将自动刷新
http://cssmediaqueries.com/overview.html
Laptop Ubuntu12, externer und interner Monitor, immer, egal wie Viewport-size:
================================================================
1 YES @media all
2 YES @media screen
3 NO @media handheld
25 YES @media all and (device-aspect-ratio: 8/5) wirkl immer!
aspect-ratio ohne device- funzt besser!
32 YES @media screen and (resolution: 96dpi)
30 YES @media all and (-webkit-device-pixel-ratio: 1)
33 NO @media all and (-webkit-device-pixel-ratio: 1.3)
35 NO @media all and (-webkit-device-pixel-ratio: 1.5)
39 NO @media all and (-webkit-min-device-pixel-ratio: 2)
40 NO @media screen and (min-resolution: 192dpi)
Laptop Ubuntu12, externer Monitor, abhaengig vom Viewport:
================================================================
12 NO @media all and (orientation:landscape) OK, gef etw zu frueh
13 YES @media all and (orientation:portrait)
14 YES @media screen and (min-width : 320px) OK, tut was es soll
15 YES @media screen and (min-width : 480px)
16 NO @media screen and (min-width : 1224px) OK, etwa 2/3 Breite
Laptop Ubuntu12, eigener Monitor, abhaengig vom Viewport:
================================================================
das gleiche (min-width : 1224px) ist fast ganze Breite OK
Samsung Smartphone, portrait gehalten
================================================================
1 YES @media all
2 YES @media screen
3 NO @media handheld !! wirklich => nicht verwenden!
12 NO @media all and (orientation:landscape) OK
13 YES @media all and (orientation:portrait) OK
14 YES @media screen and (min-width : 320px)
15 NO @media screen and (min-width : 480px) OK, gutes Merkmal!
27 YES @media all and (device-aspect-ratio: 9/16) !! zu viele Var
32 NO @media screen and (resolution: 96dpi) OK
30 NO @media all and (-webkit-device-pixel-ratio: 1)
33 YES @media screen and (-webkit-device-pixel-ratio: 1.3)!!
35 NO @media all and (-webkit-device-pixel-ratio: 1.5)
39 YES @media all and (-webkit-min-device-pixel-ratio: 2) OK, gut!
40 YES @media screen and (min-resolution: 192dpi) OK, gut!
Samsung Smartphone, landscape gehalten, Unterschiede zu Portrait
================================================================
12 YES @media all and (orientation:landscape) OK, diff!
13 NO @media all and (orientation:portrait) OK, diff!
15 YES @media screen and (min-width : 480px) OK, diff!
27 NO @media all and (device-aspect-ratio: 9/16)
!!changes, although "device"
Samsung Smartphone, landscape gehalten, Unterschiede zu Notebook Landscape
================================================================
32 NO @media screen and (resolution: 96dpi) OK
30 NO @media all and (-webkit-device-pixel-ratio: 1)
33 YES @media screen and (-webkit-device-pixel-ratio: 1.3)!!
39 YES @media all and (-webkit-min-device-pixel-ratio: 2) OK, gut!
40 YES @media screen and (min-resolution: 192dpi) OK, gut!
(ausser device-aspect-ratio, da nichtsnutz!)
mein IPad, portrait gehalten
================================================================
1 YES @media all
2 YES @media screen
3 NO @media handheld !! wirklich => nicht verwenden!
12 NO @media all and (orientation:landscape) OK
13 YES @media all and (orientation:portrait) OK
14 YES @media screen and (min-width : 320px)
15 YES @media screen and (min-width : 480px) OK, gutes Merkmal!
22 YES @media all and (device-aspect-ratio: 3/4) !! zu viele Var
27 NO @media all and (device-aspect-ratio: 9/16) !! zu viele Var
32 NO @media screen and (resolution: 96dpi) OK
30 NO @media all and (-webkit-device-pixel-ratio: 1)
33 YES @media screen and (-webkit-device-pixel-ratio: 1.3) auch hier
35 NO @media all and (-webkit-device-pixel-ratio: 1.5)
39 YES @media all and (-webkit-min-device-pixel-ratio: 2) OK, gut!
40 NO @media screen and (min-resolution: 192dpi) OK, nur Smartphone!
mein IPad, landscape gehalten, Unterscchiede
================================================================
12 NO @media all and (orientation:landscape) OK
13 YES @media all and (orientation:portrait) OK
22 YES !!! bleibt im Ggs zu Smartphone gleich!!
=> forget aspect-ratio! nutze grundsaetzlich orientation und
landscape, kann damit leide rnicht feiner tunen, aber icherheit geht
vor!
mein IPad, orientierungs- und groessenunabhaengige Unterschiede zu Notebook
================================================================
32 NO @media screen and (resolution: 96dpi) OK
33 YES @media screen and (-webkit-device-pixel-ratio: 1.3) auch hier
39 YES @media all and (-webkit-min-device-pixel-ratio: 2) OK, gut!
mein IPad, orientierungs- und groesseunabhaengige Unterschiede zu Smartphone
================================================================
15 YES @media screen and (min-width : 480px) OK, gutes Merkmal!
40 NO @media screen and (min-resolution: 192dpi) OK, nur Smartphone!
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。