普通 CSS:
.container-step1 {
text-align: center;
margin: 0 auto;
padding-top: 12%;
width: 50em !important;/*60em*/
height: 35em;
}
对于移动设备,我想更新 padding-top:25%;
。我试过:
@media only screen and (max-device-width: 480px) {
.container-step1 {
text-align: center;
margin: 0 auto;
padding-top: 25%;
width: 50em !important;/*60em*/
height: 35em;
}
}
它没有用。 Safari 仍然指的是普通的 css。
最佳答案
最大设备宽度
VS 最大宽度
。 max-width
适用于桌面和移动设备,而 max-device-width
仅适用于移动设备。
此外,您只需要添加在查询中更新的css。您可以删除所有多余的 css。
.container-step1 {
text-align: center;
margin: 0 auto;
padding-top: 12%;
width: 50em !important;/*60em*/
height: 35em;
}
@media only screen and (max-device-width: 480px) {
.container-step1 {
padding-top: 25%;
}
}
关于css - 媒体查询 :Setting padding-top based for iPhone screen,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16115576/