نظاره گر پیشرفت کسب و کار خود باشید ، وقتی اسپیناس وب جرئی از تیم شما می شود

ادامه اموزش طراحی  سایت حرفه ای با CSS:

روش هاي استفاده از CSS در اسناد HTML

برای وارد کردن کدھای CSS در یک صفحه HTML  چھار روش وجود دارد :

1. قرار دادن دستورات CSS در داخل فایل HTML (استایل داخلی)

2. قرار دادن دستورات css در یک فایل جداگانه با پسوند css. و استفاده از تگ >/ link< برای ارتباط دادناین فایل به فایل HTML ( استایل خارجی)

3. دستورات css می توانند به طور مستقیم در داخل عناصر HTML و با استفاده از صفت عمومی style درتگ ھای HTML استفاده شوند.
4. با استفاده از دستور import@ می توان دستورات css را به ھر دو صورت استایل داخلی و استایلخارجی در یک فایل وارد کرد :

اضافه کردن توضیح (کامنت) در CSS

نحوه نوشتن comment در CSS شبیه به زبان ++C بوده و به این صورت است که با علامت (*/) شروع و با علامت (/*)به پاپان می رسد :

اضافه کردن کامنت ھا در css به طراح وب کمک می کند که سریعتر کدھای  ھر بخش را پیدا کند.

قسمت هاي یک دستور CSS

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

H2 {

font-size: 24px; 

} 

با توجه به مثال بالا به طور کلی ھر دستور css دارای 3 بخش است :

• .گزینشگر (یا ھمان selectors) : که در اصل ھمان تگ ھای html ھستند و یا کلاس ھا (class) و یاشناسه ھا (id)یی ھستند که شما برای یک تگ در صفحه html تعریف کرده اید. در مثال فوق h2 گزینشگربوده و مشخص می کند که این استایل موردنظر باید به تمامی تگ ھای >h2< اعمال شود.
• .خصوصیات (یا ھمان prorerties ) : که مشخص می کنند که چه سبکی باید به برچسبھای انتخاب

شده اعمال شود.یا به عبارتی دیگر کدام خصوصیت آن تگ، مورد تغییر قرار گیرد. در مثال فوق خصوصیتfont-size اندازه فونت تگ h2 را تغییر می دھد.

• .مقادیر ( یا ھمان value ) : سومین قسمت از ھر دستور مقدار است. که مشخص می کند مقدار

خصوصیت انتخاب شده چه باشد. اگر به مثال بالا دقت کنید می بینید که px24 مقدار خصوصیت انتخابشده می باشد، که تعیین می کند اندازه فونت ھمه ی تگ ھای >h2< بیست و چھار پیکسل باشد.

دستور css قسمت چھارمی نیز دارد آن ھم علامت ;  (سمیکولن) است که در انتھای ھر دستور می آید.

نکته : اگر می خواھید بیش از یک خصوصیت از یک تگ را تغییر دھید، حتما باید برای فاصله انداختن بین propertyھااز این علامت استفاده کرد.

درضمن به یاد داشته باشیدکه خصوصیت ھا حتما باید ما بین علامت {} قرار بگیرند.

بسیار خب تا اینجا با اصول اولیه زبان CSS، طریقه افزودن کدھا، و اجزای یک دستور CSS آشنا شدید.

اموزش طراحی سایت با CSS !! ادامه اموزش در جلسه بعدی…