以html / css為主體背景的網格
[英]Grid with html/css as body background
問題描述
我想創建一個div，其中包含使用css生成的網格，並且該div出現在包含用戶界面的其他div的后面。 也就是說，主體中的一個div出現在包含用戶界面的另一個div的后面。 后面的div必須包含使用CSS的網格圖形。
<head>
<style type="text/css">
#divcontainer {
width: 100%;
height: 100%;
position: absolute;
z-index: -999;
background-color: #bababa;
}
#divinnercontainer {
width: 10%;
height: 20%;
outline: 1px solid;
float: left;
}
</style>
</head>
<body>
<div class="divcontainer">
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
<div class="divinnercontainer"></div>
</div>
<div style="z-index:999">
<!-- UI -->
</div>
這是我的代碼，但是沒有看到任何網格，我在做什么錯？
提前致謝
5 個解決方案
解決方案1
0 2016-03-12 16:27:07
問題是因為您使用#divcontainer和#divinnercontainer而不是.divcontainer和.divinnercontainer 。
解決方案2
0 2016-03-12 16:27:20
您將CSS類與CSS ID混合在一起。
您只需要更改#divcontainer {...}
#divinnercontainer {
...
}
到.divcontainer {....}
.divinnercontainer {
....
}
解決方案3
0 2016-03-12 16:28:59
＃是針對ID而非針對班級
.divcontainer {
width: 100%;
height: 100%;
position: absolute;
z-index: -999;
background-color: #bababa;
}
.divinnercontainer {
width: 10%;
height: 20%;
outline: 1px solid;
float: left;
}
密碼筆
解決方案4
0 2016-03-12 16:31:54
在css中是#divinnercontainer ，但是您將divinnercontainer稱為html中的類
解決方案5
0 2016-03-12 16:34:03
您只需要在CSS中修復類名即可：
#divcontainer 到 .divcontainer
#divinnercontainer 到 .divinnercontainer
HTML背景的主體
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.