{"id":767,"date":"2019-10-24T09:47:11","date_gmt":"2019-10-24T06:47:11","guid":{"rendered":"http:\/\/www.aydiner.gen.tr\/?p=767"},"modified":"2022-01-30T21:40:45","modified_gmt":"2022-01-30T18:40:45","slug":"css-de-satranc-tahtasi","status":"publish","type":"post","link":"https:\/\/www.aydiner.gen.tr\/index.php\/2019\/10\/24\/css-de-satranc-tahtasi\/","title":{"rendered":"Css de satran\u00e7 tahtas\u0131"},"content":{"rendered":"

\"\"<\/a>CSS kodlar\u0131 kullanarak satran\u00e7 tahtas\u0131 ve \u00fczerindeki ta\u015flar\u0131 yapaca\u011f\u0131z. Mevcut CSS \u00d6rne\u011finde etiket se\u00e7ici ve s\u0131n\u0131f se\u00e7ici kullan\u0131lm\u0131\u015ft\u0131r. Tablo bi\u00e7imlendirmesi yan\u0131 s\u0131ra sayfa arkaplan bi\u00e7imlendirmesi ve CSS ile yaz\u0131lar\u0131 ve sayfay\u0131 ortalama i\u015flemleri de \u00f6rnek i\u00e7inde yap\u0131lm\u0131\u015ft\u0131r.<\/p>\n

<\/p>\n

Uygulamay\u0131 ad\u0131m ad\u0131m yapacaklar i\u00e7in kullan\u0131lan ta\u015flar\u0131n unicode ve html kod kar\u015f\u0131l\u0131klar\u0131 \u015f\u00f6yledir.<\/p>\n

<\/div>\n\n\n\n\n\n
\u2654 &#9812;<\/td>\n\u2655 &#9813;<\/td>\n\u265a &#9818;<\/td>\n\u265b &#9819;<\/td>\n<\/tr>\n
\u2656 &#9814;<\/td>\n\u2657 &#9815;<\/td>\n\u265c &#9820;<\/td>\n\u265d &#9821;<\/td>\n<\/tr>\n
\u2658 &#9816;<\/td>\n\u2659 &#9817;<\/td>\n\u265e &#9822;<\/td>\n\u265f &#9823;<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

Html Kodu<\/strong><\/span><\/p>\n

<!DOCTYPE html>\r\n<html lang=\"tr\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">\r\n    <title> Tasar\u0131m Kodlama <\/title>\r\n    <style>\r\n        body{\r\n            background: #2f3640;\r\n        }\r\n        h1{\r\n            color:white;\r\n            font-family: sans-serif;\r\n            text-align: center;\r\n            font-size: 3em;\r\n        }\r\n        table{\r\n            margin:auto;\r\n            border:20px solid #e84118;\r\n            border-spacing: 5px;\r\n        }\r\n        table td{\r\n            width: 75px;\r\n            height: 75px;\r\n            background: #f5f6fa;\r\n            font-size:3em;\r\n            line-height: 75px;\r\n            text-align: center;\r\n            border:2px solid #2f3640;\r\n        }\r\n        .siyah{\r\n            background: #718093;\r\n            \r\n        }\r\n    <\/style>\r\n<\/head>\r\n \r\n<body>\r\n \r\n    <h1>Satran\u00e7 Tahtas\u0131 \u00d6rne\u011fi<\/h1>\r\n    <table>\r\n        <tr>\r\n            <td>&#9814;<\/td>\r\n            <td class=\"siyah\">&#9816;<\/td>\r\n            <td>&#9815;<\/td>\r\n            <td class=\"siyah\">&#9813;<\/td>\r\n            <td>&#9812;<\/td>\r\n            <td class=\"siyah\">&#9815;<\/td>\r\n            <td>&#9816;<\/td>\r\n            <td class=\"siyah\">&#9814;<\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td class=\"siyah\">&#9817;<\/td>\r\n            <td>&#9817;<\/td>\r\n            <td class=\"siyah\">&#9817;<\/td>\r\n            <td>&#9817;<\/td>\r\n            <td class=\"siyah\">&#9817;<\/td>\r\n            <td>&#9817;<\/td>\r\n            <td class=\"siyah\">&#9817;<\/td>\r\n            <td>&#9817;<\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n            <td class=\"siyah\"><\/td>\r\n            <td><\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td>&#9823;<\/td>\r\n            <td class=\"siyah\">&#9823;<\/td>\r\n            <td>&#9823;<\/td>\r\n            <td class=\"siyah\">&#9823;<\/td>\r\n            <td>&#9823;<\/td>\r\n            <td class=\"siyah\">&#9823;<\/td>\r\n            <td>&#9823;<\/td>\r\n            <td class=\"siyah\">&#9823;<\/td>\r\n        <\/tr>\r\n        <tr>\r\n            <td class=\"siyah\">&#9820;<\/td>\r\n            <td>&#9822;<\/td>\r\n            <td class=\"siyah\">&#9821;<\/td>\r\n            <td>&#9819;<\/td>\r\n            <td class=\"siyah\">&#9818;<\/td>\r\n            <td>&#9821;<\/td>\r\n            <td class=\"siyah\">&#9822;<\/td>\r\n            <td>&#9820;<\/td>\r\n        <\/tr>\r\n    <\/table>\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n
 <\/p>\n","protected":false},"excerpt":{"rendered":"
CSS kodlar\u0131 kullanarak satran\u00e7 tahtas\u0131 ve \u00fczerindeki ta\u015flar\u0131 yapaca\u011f\u0131z. Mevcut CSS \u00d6rne\u011finde etiket se\u00e7ici ve s\u0131n\u0131f se\u00e7ici kullan\u0131lm\u0131\u015ft\u0131r. Tablo bi\u00e7imlendirmesi […]<\/p>\n","protected":false},"author":1,"featured_media":188,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[41,40,43,39,42,44],"class_list":["post-767","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web","tag-css","tag-html","tag-meslek-lisesi","tag-satranc","tag-web-taarim-dersleri","tag-web-tasarim-ve-programlama-dersi"],"_links":{"self":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts\/767","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/comments?post=767"}],"version-history":[{"count":0,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/posts\/767\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/media\/188"}],"wp:attachment":[{"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/media?parent=767"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/categories?post=767"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.aydiner.gen.tr\/index.php\/wp-json\/wp\/v2\/tags?post=767"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}