问题描述
所以我将 http://augustesoesastro.com/press/ 我的网站设置为 90%,因为我想为画廊设置 2 列。因为我不知道如何用 Foogallery 制作它。
使用:
html {
zoom: 90%;
}
但代码破坏了我的标题,尤其是移动设备上放错位置的购物车图标。 有没有人知道如何仅在移动设备上禁用代码?
解决方法
您可以在 css 中使用媒体选择器
@media (max-width: 480px) {
html {
zoom: 100%;
}
}
@media (min-width: 481px) {
html {
zoom: 90%;
}
}
更新:
对于 2 列,我们可以覆盖平板电脑和手机的 css 类
@media (max-width: 1321px) {
.fg-item {
width: 38vw;
}
}
38vw - 低于 1321px 的所有屏幕的最佳值
您可以使用 min-width
max-width
调整其他范围的其他值。