html ul 增加边框,ul,li做的一个类似表格的框,设置border后,中间相交的部分因为重叠变粗...

123

function createDiv() {

var s1 = document.getElementById('s1');

var item = s1.value;

var hasChild = container.children.length ? true : false;

if(hasChild){

while(container.hasChildNodes()) //当div下还存在子节点时 循环继续

{

container.removeChild(container.firstChild);

}

}

//制定策略

var strategy =[2,10,20];

var strategyRow = [1,2,4];

var strategyIndex = 0;

//获取策略方案

for( var index = 0 ; index < strategy.length ; index++) {

var current = strategy[index];

if (item <= current) {

strategyIndex = index;

break;

}

}

//使用策略

//当前策略

var row = strategyRow[strategyIndex];

var column = item / row;

var percent = (100 - column - 1 ) /column + '%';

for(var i = 0; i < row; i++){

var rowDiv = document.createElement("div");

for(var j = 0; j < column; j++){

var columnDiv = document.createElement("div");

columnDiv.style.cssText=" float:left;height:300px;background-color: #00aa00;"+"width:" + percent+ ";";

columnDiv.class = "column";

rowDiv.appendChild(columnDiv);

}

container.appendChild(rowDiv);

}

}

html{

height: 100%;

}

body{

height: 100%;

margin: 0px;

}

.content aside{

display: block; height:100%; width:50px; background-color:red;

}

#container div > div{

margin-right: 1% ;

}

#container div > div:first-child{

margin-left: 1% ;

}

/*#container div> div:nth-child(2n+1){

margin-left: 5px ;

}*/

2

4

6

8

10

20

确定

111

222

333