بازی دوز

حالا خودت بازی کن

روی خانه‌های خالی ضربه بزن و سه نشانه را در یک خط ردیف کن. حواست به حریف هم باشد و راهش را ببند. ❌⭕

روی کامپیوتر هم می‌توانی بازی کنی. کلیدهای ۱ تا ۹ یا کلیدهای جهت‌دار و Enter را امتحان کن. 🌟

چطور بدون جاوااسکریپت کار می‌کند؟

زیر هر خانهٔ جدول یک دکمهٔ رادیویی (input type="radio") پنهان نشسته است. روی هر دکمه هم یک برچسب (label) قرار دارد که تمام خانه را می‌پوشاند.

پس وقتی روی خانه ضربه می‌زنی، در واقع روی همان برچسب می‌زنی. مرورگر بلافاصله دکمهٔ رادیویی زیرش را انتخاب می‌کند. خود دکمه پنهان می‌ماند. تو فقط نتیجه را می‌بینی: یک ایکس یا یک دایره در آن خانه. ✅

کار CSS در این بازی

CSS می‌تواند بفهمد کدام دکمه انتخاب شده است و بر اساس آن نوبت‌ها می‌چرخند. هر انتخاب تازه، قاعده‌های بعدی را عوض می‌کند و نشانه از ایکس به دایره می‌رسد.

حالا بردن چطور مشخص می‌شود؟ سازندهٔ بازی برای هر سه‌تایی برنده یک قاعدهٔ جدا نوشته است. سه ردیف، سه ستون و دو قطر. همین که سه خانهٔ یک خط علامت یکسان بگیرند، آن قاعده روشن می‌شود. بعد بازی برنده را نشان می‌دهد. 🏆

بررسی کن چقدر یاد گرفتی

یک سوال کوتاه دربارهٔ همین بازی. جواب درست را انتخاب کن.