我想要在更大的網格內繪製一個小網格。使用zIndex似乎根本不起作用,我不知道該如何做。網格里面的網格Javascript和jQuery:
代碼繪製網格
的JavaScript/JQuery的:
function creategrid(size){
var primeW = Math.floor((400)/size),
primeH = Math.floor((250)/size),
standardW = Math.floor((500)/size),
standardH = Math.floor((500)/size);
var standard = document.createElement('div');
standard.className = 'grid';
standard.style.width = (standardW * size) + 'px';
standard.style.height = (standardH * size) + 'px';
var prime = document.createElement('div');
prime.clasName = 'gridprime';
prime.style.width = (primeW * size) + 'px';
prime.style.height = (primeH * size)+ 'px';
prime.style.zIndex= '-1';
standard.appendChild(prime);
for (var i = 0; i < standardH; i++) {
for (var p = 0; p < standardW; p++) {
var cell = document.createElement('div');
cell.style.height = (size - 1) + 'px';
cell.style.width = (size - 1) + 'px';
cell.style.zIndex= '10';
standard.appendChild(cell);
}
}
document.body.appendChild(standard);
}
creategrid(10);
CSS這除了告訴電網。
CSS:
.grid {
margin: 0px auto auto;
border: 1px solid #ccc;
border-width: 0 1px 1px 0;
background-color: #28ACF9;
}
.grid div {
border: 1px solid #ccc;
border-width: 1px 0 0 1px;
float: left;
}
.gridprime {
margin-top: 50px ;
margin-left: 50px;
border: 1px solid #000;
color: #FFFF33;
float: left;
}
眼下的首要網格隱藏或不加載分配給它的CSS,你可以告訴它的存在是由它取代的細胞這一事實的唯一途徑。
理想情況下,單元格將位於標準網格和主要網格的頂部,並且主要網格將正確使用定義的樣式。
首先,你的首要電網拼錯'className'。 – voithos
這是對未加載的CSS進行排序。謝謝:) –