<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body{
margin: auto;
text-align: center;
}
div{
width: 50px;
height: 50px;
background-color: deepskyblue;
display: inline-block;
margin: 1px;
text-align: center;
}
</style>
</head>
<body>
<script type="text/javascript">
for (var m = 1; m <= 5; m++) {
for (var n = 1; n <= (2 * m - 1); n++) {
document.write("<div></div>");
}
document.write("<br />");
}
for (var m = 4; m >= 1; m--) {
for (var n = 1; n <= (2 * m - 1); n++) {
document.write("<div></div>");
}
document.write("<br />");
}
</script>
</body>
</html>