دستور زبان CSS (Syntax) 📝

CSS ساختار خیلی ساده‌ای داره. یک قانون CSS از دو بخش تشکیل شده:

ساختار کلی

selector {
  property: value;
}

• ▹Selector: به CSS میگه "کدوم المان رو بگیر"
• ▹Property: میگه "چه چیزی رو تغییر بدی" (مثلاً رنگ؟ اندازه؟)
• ▹Value: میگه "به چی تغییرش بدی"

p {
  color: blue;
  font-size: 16px;
  margin: 10px;
}

نکات مهم Syntax:

۱. حتماً از نقطه‌ویرگول (;) استفاده کنید

بعد از هر property باید نقطه‌ویرگول بذارید:

/* درست ✓ */
h1 {
  color: red;
  font-size: 24px;
}

/* غلط ✗ */
h1 {
  color: red
  font-size: 24px
}

۲. فاصله‌ها مهم نیستن (اما برای خوانایی خوبه)

این سه تا یکسانن:

/* خوانا */
p {
  color: blue;
}

/* فشرده (اما سخت‌خوان) */
p{color:blue;}

/* خیلی باز */
p {
    color   :   blue   ;
}

۳. حروف کوچک و بزرگ تفاوتی نداره (اما استاندارد: حروف کوچک)

/* همه اینا یکسانن */
p { COLOR: BLUE; }
P { color: blue; }
p { CoLoR: bLuE; }

/* اما استاندارد این هست: */
p { color: blue; }

چند Property برای یک Selector

می‌تونید تا دلتون می‌خواد property اضافه کنید:

div {
  background-color: #f0f0f0;
  color: #f8fafc;
  padding: 20px;
  margin: 10px;
  border: 1px solid #ccc;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  font-family: Arial, sans-serif;
  line-height: 1.6;
}

h2 {
  ______: ______;
  ______: ______;
  ______: ______;
}

h2 {
  color: red;
  font-size: 28px;
  text-align: center;
}