div中的背景颜色在iphone中不起作用

Posted

技术标签:

【中文标题】div中的背景颜色在iphone中不起作用【英文标题】:Background color in div doesn't work in iphone 【发布时间】:2012-09-26 13:46:12 【问题描述】:

我已经对网站http://www.domda.se 进行了一些媒体查询 问题是当我在 iphone 上查看该网站时,#middle 和 #bottom 中的背景颜色不起作用。当我添加 -1 边距以防止 div 之间出现间隙时,问题就开始了。我已尝试删除负边距以查看是否有帮助,但没有成功。

我做错了什么?

【问题讨论】:

【参考方案1】:

在这个规则中,进入这个媒体查询

@media only screen and (max-width: 480px), screen and (max-device-width: 480px),
screen and (max-width: 600px)  
/* ...some other stuff here... */
    #middle 
        background: #00ffff;
        float: none;
        margin: -1px 0 0 0;
        width: 100%;
        clear: both;
    
/* ...some more stuff here... */

您可以尝试添加overflow:hidden; 吗?也在#bottom

#bottom 
    background: #fff;
    float: none;
    margin: -1px 0 0 0;
    width: 100%;
    clear: both;
    overflow:hidden; /* ADD THIS PROPERTY ON BOTH */

我认为问题在于您要删除 float,因此容器将不再...包含其内容。

【讨论】:

以上是关于div中的背景颜色在iphone中不起作用的主要内容,如果未能解决你的问题,请参考以下文章

Rails背景颜色中的CSS在正文中不起作用

CSS 背景位置在 Mobile Safari (iPhone/iPad) 中不起作用

iOS 7 导航栏背景模糊效果在 iPhone 4 中不起作用

TailwindCSS bg-opacity 在 React 中不起作用

TapGesturecognizer 在 iphone X 12.1 的背景视图中不起作用

LPLinkView backgroundColor 在 iOS 中不起作用