css - @media 只在 locallost 上工作而不在远程服务器上工作,为什么?

标签 css media-queries

我正在从事一个 PHP - MYSQL 元素以提高我的技能。我有 2 个相同的副本,一个在本地主机上,另一个在远程服务器上。我的问题是: 为什么@media 在本地主机上工作 而在远程服务器上不工作

请注意,我在笔记本电脑(调整窗口大小)、iPad、Android 手机上进行了尝试。在本地主机上一切正常,但@media(响应)在远程服务器上不工作。

这是使网站响应的样式文件中的代码:

 /* The Media */
@media screen and (max-width: 760px ) {
#contentsBox {
        width: 100%;
    }
#sideBarBox {
    width:100%;
}
#footer1 {
    width: 100%;
}
#footer2 {
    width: 100%;
}
#footer3 {
    width: 100%;
}
.postTitle {
    font-size: 105%;
}

#navMobileIcon{
    display: inline-block;
}
#navMenuBox #navMenu, #navMenuBox:active #navMenu{
    display: none;
    z-index: 1000;
    position: absolute;
    padding: 20px;
    background: #333;
    right: 20px;
    top: 80px;
    border: 2px solid #FFFFFF;
    border-radius: 10px 0 10px 10px;
    width: 50%;
}
#navMenuBox:hover #navMenu{
    display: block;
}
#navMenuItem {
    text-align: center;
    width: 100%;
    padding: 10px 0;
}
#navMenu a{
    font-size: 90%;
        color: #FFFFFF;
}
#logo {
    width: 100%;
}
#widgetTitle {
    font-size: 90%;
}
.footerWidgetTitle {
    font-size: 90%;
}
}

最佳答案

试试这个:

@media screen
{
  @media (max-width: 760px)        
}

关于css - @media 只在 locallost 上工作而不在远程服务器上工作,为什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45010749/

相关文章:

html - 只有当页面足够小时才让页脚贴在底部

javascript - CSS 可见性切换,页面加载时未选中,默认错误地显示 d3 SVG 类

html - 媒体查询断点不准确

javascript - 更改背景大小需要新的背景位置,有什么解决方法吗?

javascript - 如何制作扩展文本框?

html - 隐藏的 div 未在移动设备上隐藏

jquery - 只有第一个媒体查询有效

css - 调整浏览器大小时显示右边距

css - 菜单图标不消失

javascript - 如何在移动设备上显示图片的实际宽度?