قواعد نحوی CSS – قانون، گزینشگر، اظهاریه و ویژگی در سی‌اس‌اس

همانطور که در قسمت معرفی CSS گفتیم شیوه نامه های آبشاری با کمک مجموعه‌ای از قانون (یا Rule) ها ظاهر المان ها را مشخص می‌کنند. بنابراین برای نگارش این شیوه‌نامه ها لازم است ابتدا با قواعد نحوی CSS و جزئیات نگارش این قوانین آشنا شوید.

اجزای مختلف یک قانون CSS

در مثال زیر سینتکس یا ساختار نحوی CSS را در قالب یک قانون سی‌اس‌اس و بخش‌های مختلف آن مشاهده می‌کنید:

هر قانون سی‌اس‌اس از دو بخش یا بلوک گزینشگر (Selector) و اظهاریه (Declaration) تشکیل می‌شود. بخش اول شامل یک یا چند گزینشگر CSS می‌شود. المان هایی که می‌خواهید اظهاریه های قانون روی آن‌ها اعمال شود (یا استایل آن‌ها را تعیین کنید) با کمک همین گزینشگرها مشخص می‌شوند. گزینشگرهای موجود در این بخش با کمک یک کاما از هم جدا می‌شوند. در مثال فوق h1 و p دو گزینشگر یا سلکتور هستند که به المان های <h1> و <p> در HTML اشاره می‌کنند.

بیشتر بخوانید: گزینشگر یا سلکتور در CSS و انواع آن‌ها

بخش اظهاریه نیز شامل یک یا چند اظهاریه می‌شود که مابین دو آکولاد باز و بسته یا { } قرار می‌گیرند. اظهاریه ها به یک سمی کلن یا ; ختم می‌شوند. هر اظهاریه هم شامل یک نام ویژگی (Property name) و مقدار (Property value) متناظر با آن می‌شود که توسط یک کلن یا : از هم جدا می‌شوند. در مثال فوق بخش اظهاریه شامل دو اظهاریه color:red و font-size:16px است. در این اظهاریه‌ها از دو ویژگی با نام های color و font-size همراه با مقادیر red و 16px برای این دو ویژگی استفاده شده است.

توضیح تکمیلی: قانون فوق باعث می‌شود رنگ نوشته برای المان های <h1> (هدینگ های سطح اول) و <p> (پاراگراف ها) به صورت قرمز و با اندازه فونت 16 پیکسل مشخص شود. در قسمت های آتی با انواع گزینشگرها و ویژگی های مختلف در CSS بیشتر آشنا می‌شوید.

بازگشت به فهرست مجموعه آموزشی CSS