HTML and CSS Reference
In-Depth Information
5.
Press F5 to preview this page, which should look like Figure
14-3
.
Figure 14-3.
The initial board
6.
now you'll add the checkers by including an
img
element inside the appropriate
div
elements. Add the code shown in bold in Listing 14-3.
Listing 14-3.
Adding the images
<text>
<div id="@id" class="@css" draggable="false">
@if ((x
+
y) % 2 !
=
0 && y !
=
3 && y !
=
4)
{
string imgSrc;
string pid;
if (y < 3)
{
imgSrc="Images/WhitePiece.png";
pid="w"+id;
}
else
{
imgSrc = "Images/BlackPiece.png";
pid = "b" + id;
}
<text>
<img id="@pid" src="@imgSrc" draggable="true" class="piece" >
</text>
}
</div>
</text>
