<style>
body {
background-color:#ECE9D8;
}
/* CSS cái sau sẽ đè lên cái trước (nếu thiết lập là trùng) */
.cell, .closecell, .fcell, .fclosecell {
width: 150px; /* W=150 */
float: left;
border: red 1px solid;
border-bottom: 0px;
padding: 3px 0px 3px 3px;
}
.cell {
border-right: 0;
border-bottom: 0;
}
.fcell {
border-right: 0;
border-bottom: red 1px solid;
}
.fclosecell {
border-bottom: red 1px solid;
}
</style>
<center>
<div style="margin: 0pt auto; font-size: 80%; width: 960px;text-align:left;"><!-- MW=800 -->
<div style="float:left;width:160px;">
<script type="text/javascript"><!--
google_ad_client = "pub-6121234494283237";
/* 160x600, Được tạo ra 08/11/2008 */
google_ad_slot = "3281021486";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<div>
<strong>Table or Div?</strong></div>
<br>
<script>
function mkTable(nc) { // number cells
nco = 5; // number columns in each row. Note nco * W (width of cell) must be ~ MW, to show table correctly
if (nc % nco != 0)
lim = (nc - nc % nco) / nco;
else
lim = nc / nco - 1;
incr = 0; // increase row
for (i = 0; i < nc;) {
if (incr < lim) {
for (j = 0; j < nco - 1; j++) {
v = "[" + (incr+1) + "][" + (j+1) + "]";
document.write("<div class=cell>" + v + "</div>");
}
v = "[" + (incr+1) + "][" + (j+1) + "]"; // last cell of row
document.write("<div class=closecell>" + v + "</div>");
i += nco;
} else { // last row
for (j = 0; j < nco - 1; j++) {
v = "[" + (incr+1) + "][" + (j+1) + "]";
if (i + j < nc)
document.write("<div class=fcell>" + v + "</div>");
else
document.write("<div class=fcell> </div>");
}
v = "[" + (incr+1) + "][" + (j+1) + "]";
if (i + j < nc)
document.write("<div class=fclosecell>" + v + "</div>");
else
document.write("<div class=fclosecell> </div>");
i += nco;
}
incr++;
}
}
// mkTable(102);
</script>
<!-- huyphungvan -->
<div class="cell">
[1][1]</div>
<div class="cell">
[1][2]</div>
<div class="cell">
[1][3]</div>
<div class="cell">
[1][4]</div>
<div class="closecell">
[1][5]</div>
<div class="cell">
[2][1]</div>
<div class="cell">
[2][2]</div>
<div class="cell">
[2][3]</div>
<div class="cell">
[2][4]</div>
<div class="closecell">
[2][5]</div>
<div class="cell">
[3][1]</div>
<div class="cell">
[3][2]</div>
<div class="cell">
[3][3]</div>
<div class="cell">
[3][4]</div>
<div class="closecell">
[3][5]</div>
<div class="cell">
[4][1]</div>
<div class="cell">
[4][2]</div>
<div class="cell">
[4][3]</div>
<div class="cell">
[4][4]</div>
<div class="closecell">
[4][5]</div>
<div class="cell">
[5][1]</div>
<div class="cell">
[5][2]</div>
<div class="cell">
[5][3]</div>
<div class="cell">
[5][4]</div>
<div class="closecell">
[5][5]</div>
<div class="cell">
[6][1]</div>
<div class="cell">
[6][2]</div>
<div class="cell">
[6][3]</div>
<div class="cell">
[6][4]</div>
<div class="closecell">
[6][5]</div>
<div class="cell">
[7][1]</div>
<div class="cell">
[7][2]</div>
<div class="cell">
[7][3]</div>
<div class="cell">
[7][4]</div>
<div class="closecell">
[7][5]</div>
<div class="cell">
[8][1]</div>
<div class="cell">
[8][2]</div>
<div class="cell">
[8][3]</div>
<div class="cell">
[8][4]</div>
<div class="closecell">
[8][5]</div>
<div class="cell">
[9][1]</div>
<div class="cell">
[9][2]</div>
<div class="cell">
[9][3]</div>
<div class="cell">
[9][4]</div>
<div class="closecell">
[9][5]</div>
<div class="cell">
[10][1]</div>
<div class="cell">
[10][2]</div>
<div class="cell">
[10][3]</div>
<div class="cell">
[10][4]</div>
<div class="closecell">
[10][5]</div>
<div class="cell">
[11][1]</div>
<div class="cell">
[11][2]</div>
<div class="cell">
[11][3]</div>
<div class="cell">
[11][4]</div>
<div class="closecell">
[11][5]</div>
<div class="cell">
[12][1]</div>
<div class="cell">
[12][2]</div>
<div class="cell">
[12][3]</div>
<div class="cell">
[12][4]</div>
<div class="closecell">
[12][5]</div>
<div class="cell">
[13][1]</div>
<div class="cell">
[13][2]</div>
<div class="cell">
[13][3]</div>
<div class="cell">
[13][4]</div>
<div class="closecell">
[13][5]</div>
<div class="cell">
[14][1]</div>
<div class="cell">
[14][2]</div>
<div class="cell">
[14][3]</div>
<div class="cell">
[14][4]</div>
<div class="closecell">
[14][5]</div>
<div class="cell">
[15][1]</div>
<div class="cell">
[15][2]</div>
<div class="cell">
[15][3]</div>
<div class="cell">
[15][4]</div>
<div class="closecell">
[15][5]</div>
<div class="cell">
[16][1]</div>
<div class="cell">
[16][2]</div>
<div class="cell">
[16][3]</div>
<div class="cell">
[16][4]</div>
<div class="closecell">
[16][5]</div>
<div class="cell">
[17][1]</div>
<div class="cell">
[17][2]</div>
<div class="cell">
[17][3]</div>
<div class="cell">
[17][4]</div>
<div class="closecell">
[17][5]</div>
<div class="cell">
[18][1]</div>
<div class="cell">
[18][2]</div>
<div class="cell">
[18][3]</div>
<div class="cell">
[18][4]</div>
<div class="closecell">
[18][5]</div>
<div class="cell">
[19][1]</div>
<div class="cell">
[19][2]</div>
<div class="cell">
[19][3]</div>
<div class="cell">
[19][4]</div>
<div class="closecell">
[19][5]</div>
<div class="cell">
[20][1]</div>
<div class="cell">
[20][2]</div>
<div class="cell">
[20][3]</div>
<div class="cell">
[20][4]</div>
<div class="closecell">
[20][5]</div>
<div class="fcell">
[21][1]</div>
<div class="fcell">
[21][2]</div>
<div class="fcell">
</div>
<div class="fcell">
</div>
<div class="fclosecell">
</div>
</div>
</center>
Title:
Create table with div tag
Description:
<style> body { background-color:#ECE9D8; } /* CSS cái sau sẽ đè lên cái trước (nếu thiết lập là trùng) */ .cell, .closecell, .fcel...
...
Rating:
4