webかたつむり ウェブデザインを勉強中 ウェブ初心者のおぼえがき

webかたつむり

WEB制作会社のフォトグラファー

php for かけ算99表

f:id:ohta-felica:20160817180503p:plain

 

  • 表を下書きして、なにを繰り返せばいいのか、冷静に考えればいい。
  • 赤字の部分を冷静に記述できるか、それだけ。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>かけ算99表</title>
<style>
html, body, table, th, td, tr{
margin: 0;
padding: 0;
line-height: 1.0;
}
.container{
width: 640px;
margin: 50px auto;
}
table, th, td{
border: 1px solid #777;
border-collapse: collapse;
box-sizing: border-box;
text-align: center;
}
table{
width: 640px;
}
th{
background: #ccc;
}
td{
width: 64px;
}
</style>
</head>

<body>
<div class="container">
<table>
<tr>
<th>&nbsp;</th>
<?php
for ($i = 1; $i <= 9; $i++) {
echo '<th>'.$i.'</th>';
}
?>
</tr>

<?php
for ($j = 1; $j<=9; $j++){
echo '<tr><th>'.$j.'</th>';
for ($i = 1; $i <= 9; $i++){
echo '<td>'.$i*$j.'</td>';
}
echo '</tr>';
}
?>
</table>
</div>
</body>
</html>