html — изображения не отображаются на шахматной доске
Наша задача — создать шахматную доску 8х8, в которой вы должны положить на доску 8 ферзей, в которых они не смогут есть друг друга. Моя проблема в этом коде заключается в том, что изображения королевы (qb.png & qw.png) не отображаются в выходных данных. Может кто-то указать, что не так? Большое спасибо.
<HTML>
<head>
<title>Queen's Puzzle</title>
</head>
<style type = "text/css">
table{
border-collapse: collapse;
width: 800px;
border: 1px solid;
}
td{
height: 100px;
width: 100px;
}
.white{
background-color: #FFFFFF;
}
.black{
background-color: #000000;
}
.qw{
width: 95px;
height: 95px;
}
</style>
<body>
<?php
$pos = array(2, 7, 3, 6, 0, 5, 1, 4);
$a = false;
echo '<table>';
for ($row = 0; $row < 8; $row++){
echo '<tr>';
for ($col = 0; $col < 8; $col++){
if ($pos[$row] == $col){
if($a){
echo '<td img class="qw" src="qb.png"></td>';
$a = false;
} else {
echo '<td img class="qb" src="qw.png"></td>';
$a = true;
}
} else {
if($a){
echo '<td class="black"></td>';
$a = false;
} else{
echo '<td></td>';
$a = true;
}
}
}
echo '</tr>';
$a = !($a);
}
echo '</table>';
?>
</body>
</html>
Решение
этот:
echo '<td img class="qw" src="qb.png"></td>';
Должно быть:
echo '<td><img class="qw" src="qb.png"></td>';
?
Другие решения
Элемент td не имеет атрибута src.
Тег тд должен быть:
echo '<td class="qw"></td>';
Затем вы можете легко создать фоновое изображение для класса в css следующим образом:
.qw{
width: 95px;
height: 95px;
background-image: url("qb.png");
}