آموزش CSS (قسمت ۴ : CSS در HEAD صفحه) | خدمات کامپیوتری امداد133
خانه / کامپیوتر / اموزش / آموزش CSS (قسمت ۴ : CSS در HEAD صفحه)

آموزش CSS (قسمت ۴ : CSS در HEAD صفحه)

استفاده از استایلها می تواند به ما کمک کند تا از دوباره نویسی فرمانها جلوگیری کنیم. برای انجام این کار ما می توانیم یک Style را در بخش HEAD در متن HTML خود تعریف کنیم. یک استایل در HEAD با تگ <STYLE> آغاز می شود و با <STYLE/> به پایان می رسد. در قسمت زیر می توانید یک نمونه از استایل را که مشخصاتی را برای تگ <SPAN> تعریف می کند مشاهده کنید که در بخش HEAD در متن قرار گرفته است.

همانطور که می بینید استایل با تگ <style> آغاز می شود، در قسمت بعد این خط را مشاهده می کنید :

این خط مشخص می کند که هر بار که در صفحه از تگهای <STYLE> <STYLE/> استفاده می شود. متن بین آنها به رنگ قرمز و به صورت ایتالیک نمایش داده می شود. در نوشتن استایل باید در نظر داشته باشید که نباید از علامتهای کوچکتر و بزرگتر ( < و > ) که در اطراف تگهای HTMLL استفاده می شود، استفاده کنید. همچنین به جای استفاده از علامتهای نقل قول ( ” “ ) که در متن HTMLL استفاده می شود از آکولاد ( { } ) در اطراف خواص استایل استفاده می کنیم. خواص مختلف یک استایل هم به وسیله یک نقطه ویرگول ( ; ) از هم جدا می شوند.

 

وقتی ما استایلی را در بخش HEAD متن خود برای یک تگ خاص تعریف می کنیم برای محتویات همه تگهایی که استایل برای آن تعریف شده در صفحه مورد استفاده قرار می گیرد. برای مثال وقتی که ما کد بالا را در HEAD متن خود قرار دادیم، هر تگ <SPAN> که در صفحه استفاده شود دارای متنی قرمز و ایتالیک است و نیاز ندارید هر بار دوباره مشخصات متن مورد نظر را تعریف شود.

 

برای مثال کد زیر را در متن HTML خود مینویسیم :

 

نتیجه را به صورت زیر مشاهده خواهید کرد :

این متن قرمز و ایتالیک است، اما این متن خارج تگ <span> است و مشخصات آنرا ندارد.

این متن نیز قرمز و ایتالیک است.

با این روش ما می توانیم تقریباً خواص همه تگهای HTML را کنترل کنیم، اما این کافی نیست. در قسمتهای بعدی روشهایی را معرفی می کنیم که یک استایل مشخص به وسیله تگهای مختلفی مورد استفاده قرار بگیرد. این کا را با استفاده از CLASS و ID انجام می دهیم که به آن خواهیم پرداخت.

 


نکته ای که باید توجه کنید رعایت استاندارد های مهم در استایل نویسی است، استایل های css اهمیت بسیار زیادی در دنیای وب دارند بنابراین رعایت استاندارد های کامل آنها و نحوه درست نوشتن آنها بسیار مهم است.

 

اگر از استایل در بخش head صفحه خود استفاده کنید با نوشتن <style> و بستن این تگ می توانید از استایل ها استفاده کنید اما استاندارد نیست و شما باید نوع استایل را نیز در آن درج کنید برای این کار از شناسه type با مقدار text/css استفاده میکنیم ، با این کار ما برای مرورگر مشخص میکنیم که این استایل به صورت متنی به زبان CSS نوشته شده است. که به شکل زیر نوشته می شود :

 

یکی دیگر از استاندارد هایی که در استایل نویسی رعایت می شود بدین صورت است که بعد از نوشتن نام کلاس یا آی دی یک فاصله داده و از } استفاده میکنید، و بعد از زدن } یک اینتر بزنید و به خط بعد بروید، در خط بعد یکبار دکمه Tabb را بزنید تا مقداری نوشته های شما تو رفتگی پیدا کند و در انتهای هر مقدار علامت ; را قرار داده و در خط بعد خاصیت بعدی را بنویسید و در نهایت بعد از نوشتن خاصیت ها و مقادیر یک بار دیگر دکمه اینتر را بزنید و علامت { را برای تمام کردن آن استایل در ابتدای خط بعد قرار دهید؛ به نمونه زیر توجه کنید :

البته این حالت نوشتن به صورت اختیاری است اما استاندارد ترین حالت نوشتن سی اس اس مشابه نمونه بالا می باشد زیرا اگر شما به این صورت کد نویسی را انجام دهید ، در آینده برای ویرایش کد ها و اعمال تغییرات به راحتی میتونید بخش مورد نظر خودتون رو پیدا کنید و هم اینکه ظاهری مشخص دارد .

 


 

توجه نمایید که در آینده ما برنامه نویسی های خودمان را دیگر در نرم افزار notepad انجام نمی دهیم و از نرم افزار پیشرفته کد نویسی Adobe Dream Weaver استفاده میکنیم، در این نرم افزار و نرم افزار هایی با کارکرد مشابه مانند NotePad++ و PageDesigner و … کد های استایل CSS  به صورت استاندارد بالا نوشته خواهد شد.

 

اسم هایی که شما در استایل نویسی برای کلاس و آی دی ها انتخاب میکنید کاملاً اختیاری است اما لازم به ذکر است که کد نویسی ما محدود به چند استایل و فقط یک صفحه نمی باشد و در آینده کد نویسی های سنگین و طولانی خواهیم داشت و برای طراحی یک سایت کامل مسلماً حجم استایل بسیار زیادی خواهید داشت بنابراین پیشنهاد میکنیم از عناوین مناسب برای نام گذازی استفاده کنید تا در آینده جهت ویرایش و … با مشکل مواجه نشوید .

درباره ی nasimazadi

مطلب پیشنهادی

واحد پردازش مركزي CPU 

واحد پردازش مركزي CPU مدت زمان انجام يك كار بوسيله كامپيوتر، به عوامل متعددي بستگي …

پاسخ دهید