شکل کلی نوشتار کدهای css که به آن syntax (نحو) می گویند، به شکلی زیر است:

selector: نام یک عنصر یا راهی برای شناخت یک عنصر (مانند استفاده از id یا class) می باشد و عنصری را مشخص می کند که قرار است کدهای ما بر روی آن اعمال شود.

property: نام صفتی از صفات عنصر که می خواهیم مقداری برای آن مشخص کنیم. مانند: font-size، color، width و … .

value:مقداری برای صفتی از صفات عنصر که در property مشخص شده است.

جداکردن propertyها از یگدیگر

برای هر عنصر می توان ویژگی های زیادی را مقداردهی کرد (به تعداد دلخواه). همانطور که دیدید هر ویژگی یک مقدار نیز به همراه خود دارد. برای جداکردن هر ویژگی و مقدارش از یک ویژگی دیگر که برای عنصر مشخص شده از کاراکتر ; استفاده می شود. پس اگر تنها یک ویژگی مقداردهی شده باشد یا برای آخرین ویژگی مقداردهی شده می توان از این کاراکتر استفاده نکرد.

نیازی نیست که peropertyها در کنار یکدیگر و در یک خط باشند و می توانند به شکل زیر هم قرار گرفته باشند:

همچنین تمامی ویژگی ها به همراه مقادیرشان درون آکولاد {} قرار می گیرند.

یک مثال ساده

در این مثال تگ body به عنوان عنصر هدف مشخص شده و ویژگی های تعیین شده در تمام این عنصر اعمال می شوند.

برای مثال ویژگی color با مقدار #039 یا ویژگی font-size با مقدار 14px تعیین شده اند که به ترتیب رنگ متون و اندازه فونت متون را در عنصر body مشخص می کنند.

کامنت کردن کدها – commenting

همانطور که در همه ی زبان ها عمل commenting را داریم که کار غیرفعال کردن کد ها و یا نوشتن توضیحات را می کنند در زبان css هم این امکان را داریم.

همانطور که گفته شد عمل کامنتینگ بیشتر برای نوشتن توضیحاتی در کنار کدهای اصلی به کار می رود که باعث می شود کد خواناتر باشد تا هرکس با دیدن این کد از کارایی آن مطلع شود.

کامنت ها در css با /* شروع و با */ به پایان می رسند:

در این کد سه بار و سه خط comment شده اند.