效果图:
HTML:
<body>
<div id="main">
</div>
</body>
CSS:
.row{
text-align: center;
width: 800px;
margin: 0 auto;
}
.col{
border: 1px solid #000000;
display: inline-block;
width: 60px;
height: 20px;
}
JS:
let main=document.getElementById('main');
for(let i=1;i<=9;i++){
let row=document.createElement('div');
row.className='row';
main.appendChild(row);
for(let j=1;j<=i;j++){
let col=document.createElement('div');
col.className='col';
let content='<span>'+i+'*'+j+'='+i*j+'</span>';
row.appendChild(col);
col.innerHTML=content;
}
}