Unicode satranç karakterleri ile istediğiniz özeliklerde satranç tahtasını web uygulamanıza yerleştirebilirsiniz.
| Name | Symbol | Codepoint | HTML |
|---|---|---|---|
| white chess king | ♔ | U+2654 | ♔ |
| white chess queen | ♕ | U+2655 | ♕ |
| white chess rook | ♖ | U+2656 | ♖ |
| white chess bishop | ♗ | U+2657 | ♗ |
| white chess knight | ♘ | U+2658 | ♘ |
| white chess pawn | ♙ | U+2659 | ♙ |
| black chess king | ♚ | U+265A | ♚ |
| black chess queen | ♛ | U+265B | ♛ |
| black chess rook | ♜ | U+265C | ♜ |
| black chess bishop | ♝ | U+265D | ♝ |
| black chess knight | ♞ | U+265E | ♞ |
| black chess pawn | ♟ | U+265F | ♟ |
Tamamen html + css ile oluşturulmuş satranç tahtası;
| 8 | ♜ | ♞ | ♝ | ♛ | ♚ | ♝ | ♞ | ♜ |
| 7 | ♟ | ♟ | ♟ | ♟ | ♟ | ♟ | ♟ | ♟ |
| 6 | ||||||||
| 5 | ||||||||
| 4 | ||||||||
| 3 | ||||||||
| 2 | ♙ | ♙ | ♙ | ♙ | ♙ | ♙ | ♙ | ♙ |
| 1 | ♖ | ♘ | ♗ | ♕ | ♔ | ♗ | ♘ | ♖ |
| a | b | c | d | e | f | g | h |
Tablo için kullanılabilecek HTML kodları;
<table style="border-collapse: collapse; border-color: black; border-spacing: 0pt; border-style: solid; border-width: 0pt 0pt 0pt 0pt; font-family: "arial unicode ms"; text-align: center;">
<tbody>
<tr>
<td style="width: 12pt;">8</td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♜</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♞</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♝</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♛</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♚</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♝</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 0pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♞</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 1pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♜</span></td>
</tr>
<tr>
<td style="width: 12pt;">7</td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♟</span></td>
</tr>
<tr>
<td style="width: 12pt;">6</td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;"><br /></span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"></td>
</tr>
<tr>
<td style="width: 12pt;">5</td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;"><br /></span></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"></td>
</tr>
<tr>
<td style="width: 12pt;">4</td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;"><br /></span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"></td>
</tr>
<tr>
<td style="width: 12pt;">3</td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;"><br /></span></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="height: 24pt; width: 24pt;"></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"></td>
</tr>
<tr>
<td style="width: 12pt;">2</td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 0pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td bgcolor="silver" style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td style="height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 0pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♙</span></td>
</tr>
<tr>
<td style="width: 12pt;">1</td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 1pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♖</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♘</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♗</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♕</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♔</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♗</span></td>
<td bgcolor="silver" style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 0pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♘</span></td>
<td style="border-collapse: collapse; border-color: black; border-style: solid; border-width: 0pt 1pt 1pt 0pt; height: 24pt; width: 24pt;"><span style="font-size: 150%;">♖</span></td>
</tr>
<tr>
<td></td>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
<td>e</td>
<td>f</td>
<td>g</td>
<td>h</td>
</tr>
</tbody></table>
Hiç yorum yok:
Yorum Gönder