爲iPad/iPhone /桌面

<style> 
// To show on laptop 
#lala { 
position: absolute; 
top: -520px; 
right:-250px; 
} 
// To show on iPhone 
@media screen and (device-width:480px) { 
#lala{ 
top:0; 
} 
} 
// To show on tablets 
@media screen and (device-width:768px) { 
#lala{ 
top: 1; 
right: 0; 
} 
} 
</style> 
<div id="lala"> 
[contactform] 
</div>

不同勢格的風格，我試圖用max-device-width和min-device-with切換，但我無法得到它的權利。我想爲每個設備設計contactform diffrent，我做錯了什麼？爲iPad/iPhone /桌面

所以如果寬度=== 768px顯示樣式{ }如果width === 480px顯示樣式{ }否則顯示標準樣式。

來源

2014-04-03 user3448595

裏面你在你的HTML有這樣的meta標籤？ – Grumpy

嘗試

<style> 
// To show on laptop 
#lala { 
position: absolute; 
top: -520px; 
right:-250px; 
} 
// To show on iPhone 
@media (max-width: 480px) { 
#lala{ 
top:0; 
} 
} 
// To show on tablets 
@media (max-width: 768px) { 
#lala{ 
top: 1; 
right: 0; 
} 
} 
</style> 
<div id="lala"> 
[contactform] 
</div>

請確保您有

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

的

<head></head>

來源

2014-04-03 23:25:49 Gadgetster

爲iPad/iPhone /桌面

回答

相關問題