آموزش طراحی وب

قواعد دستوری CSS

در این جلسه به شما قواعد دستوری CSS آموزش داده میشه.

CSS

فصل اول : مبانی CSS

جلسه چهارم  : قواعد دستوری CSS

سلام به همراهان همیشگی مدرسه مجازی ایرانیان

در ابتدا سال نو رو به شما دوستان عزیز تبریک میگم و سالی سرشار از سلامتی و موفقیت رو براتون آرزو میکنم .

جلسه ی پیش در رابطه با نحوه استفاده از CSS صحبت کردیم ، تو این جلسه به شما قواعد دستوری  CSS رو توضیح میدم .

قواعد دستوری CSS سخت نیست . فضاهای خالی و خطوط اضافه برای درک بهتر و خوانایی بیشتر کدها به تعداد دلخواه هیچ مشکلی نداره ، شما میتونید برای بهینه کردن فایل CSSتون در پایان کار اون رو فشرده کنید پس نگران فشرده سازی فایلتون نباشید و هر مدلی که راحت هستید دستورات رو بنویسید .

CSS نسبت به حروف بزرگ و کوچک حساس نیست .البته در برخی موارد ، عوامل خارجی مثل نوع زبانی که از CSS استفاده می کنه و یا سیستم عامل در این بین نقش دارند .برای استاندارسازی کارتون همیشه دستورات رو با حروف کوچک بنویسید .

مثلا نام تگ ها در HTML به حروف بزرگ و کوچک حساس نیستند اما در XHTML این حساسیت وجود داره . نام فونت ها هم به استثنای فونت های عمومی که برای CSS شناخته شده هستند ، در برخی سیستم عامل ها این حساسیت رو دارند .

خوب میریم سراغ قواعد دستوری CSS ، برای نوشتن دستورات CSS میتونید از نرم افزارهای مختلف استفاده کنید . نرم افزار معمولی که استفاده میشه  notepad++ و یا  Dream Weaverهست اما من شخصا از NuSphere PhpED استفاده می کنم . شما میتونید با هر نرم افزاری که راحت هستید کارتون رو شروع کنید .

برای شروع به تصویر زیر دقت کنید :

قواعد دستوری CSS

خط اول یک کامنت (توضیحات) رو نشون میده ، شما برای درج توضیحات در فایل CSS میتونید از این دستور استفاده کنید . به این صورت که توضیحاتتون رو بین دو علامت  /* و  */ قرار بدید . توضیحاتتون میتونه فارسی هم باشه با این شرط که فایل رو utf-8 ذخیره کنید .

خط دوم یک دستور و یک قانون هست که با استفاده از این دستور یک فایل CSS دیگه هم به این فایل پیوست میکنیم .

خط سوم دستوری هست که مجموعه ای از قواعد رو در برمیگیره . در این دستور که مشاهده می کنید ما به صفحه که همون body محسوب میشه گفتیم تمامی رنگ فونت ها #۰۰۰ باشه و ضخامت فونت ها هم نرمال باشه .

همونطور که ملاحظه می کنید ، برای نوشتن قواعد ابتدا نام Selector رو مینویسیم سپس با علامت ”  {  ” بلاک رو باز می کنیم و قواعد رو لحاظ می کنیم و سپس با علامت ”  }  ” بلاک رو میبندیم .  قواعد در بلاک ها با کاراکتر ”  ;  ”  از هم جدا میشوند که برای قاعده آخر نیازی به این کاراکتر نیست چرا که قاعده ای بعد از اون نیست . هر قاعده از یک نام و یک مقدار تشکیل میشه که با علامت ”  :  ”  از هم تفکیک میشوند .

syntax css

قواعد در CSS مجموعه ای از دستورات هستند که این دستورات یا یک قانون هستن یا مجموعه ای از قواعد که در مثال های بالا ملاحظه کردید .

در صورتی که بخواین برای چند Selector قواعد یکسان تعریف کنید . به شکل زیر عمل می کنید :

 تمامی Selector ها رو با کاراکتر ”  ,  ”  از هم جدا می کنیم .

خوب دوستان این جلسه هم به پایان رسید . امیدوارم که مفید واقع شده باشه .

 تهیه شده در مدرسه مجازی ایرانیان

حسین همت یار

نویسنده در مدرسه مجازی ایرانیان ، دانشجوی رشته IT ، طراح وب و علاقه مند به تازه های دنیای اینترنت و وب و البته لینوکس

۱ دیدگاه

آیا سوالی دارید؟

پنل کاربران

بستن
*
*

نظرسنجی

به کدام دسته موضوعی علاقه مند هستید؟

آخرین پرسش و پاسخ ها

اموزش تصادفی

خبرهای باحال دریافت کن

خبرهای باحال دریافت کن

ما هم مثل شما از دریافت ایمیل های مزاحم خوشمون نمیاد. فقط مطالب جدید و خبرهای ویژه رو به اطلاع شما میرسونیم. قول میدیم اسپم نکنیم :)

ثبت نام انجام شد ، لطفا ایمیلی که براتون ارسال میشه رو تایید کنین