html - 移动 css/html 是否有一套不同的规则

标签 html css background

我似乎无法在 css 中显示背景图像。和 我似乎也无法获得显示任何颜色的 div 背景

#mlogo {
    background-image: url(/mobileimages/2015LOGOFB.jpg);
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
    position: relative;
    width:100%;
    text-align:center;


}


#mwrap {
    background-color: black;
    position: relative;
    width:100%;
    text-align:center;
    overflow:hidden
}



#mindex {
    background-color:black;
    position: relative;
    width:100%;
    text-align:center;
    border-style: solid;
    border-width: 1px;
    border-color: #a1a1a1;

}

我知道浏览器至少链接到一些 css,因为我使用的一些文本 (mindex) 显示正确。这些是喜欢使用的 div id。

<div id="mwrap">

<div id="mlogo" align="center">

</div>

<div id="mindex" align="center">
<p id="menu1">Photo And Video</p>
</div>

<div id="mindex" align="center">
<p id="menu1">Scores</p>
</div>

<div id="mindex" align="center">
<p id="menu1">Standings</p>
</div>


</div>

我正在为一个已经存在的桌面网站创建一个单独的移动网站。 到目前为止,我已经在 android (galaxy 4) 和 iphone 6 上查看了我的代码。 两个显示器完全相同。

我不明白为什么图像不会显示为 div 的背景,我不明白为什么我不能将整个网站的背景颜色设置为黑色。 如果我使用 <img src"">,img 将显示在 html 中,但如果我将它添加到我用来定义网站不同部分的 div 框的 css 中,则不会

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="mobilesummer.css">
 <title>SSL 2015</title>

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

</head>

这是我的头标

我迷失在这个问题上……一些简单的东西让我变得复杂了??

最佳答案

div 上没有高度,因此 div 没有包裹在内容周围(如果这有意义的话)。

您还可以删除 position:relative 并添加 float:left;连同宽度:100%;这将允许 div 根据内容扩展高度,也就是说,如果您不需要看起来不需要的相对属性。

希望对您有所帮助。

关于html - 移动 css/html 是否有一套不同的规则,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31370215/

相关文章:

javascript - 在 jquery 对话框标题栏中设置图标样式

jquery - angulajrjs 弹出时间选择器不在输入行内

javascript - Jquery val() 不带回文本框的值

PHP : Search with drop down list

html - 许多框(div 元素),它们之间有一个空格

html - 应该流到下一行的文本不会增加父框模型

javascript - 单击 <the> 将类添加到 div

android - 缩放背景图像以包装布局内容

android - Galaxy Nexus 上没有显示背景图片(仅)?

html - 为什么我的第一个 div 背景不是红色