جستجو پیشرفته محصولات

خواندن این مطلب

4 دقیقه

زمان میبرد!

Css

Css چیست؟

سی اس اس مخفف Cascading Style Sheet (CSS) است. زبان css یکی از زبان های برنامه نویسی طراحی صفحات وب برای ایجاد و ساخت مشخصات ظاهری اسناد و اطلاعات وب سایت می باشد. css یکی از رایج ترین و محبوب ترین ابزارهای طراحی صفحات وب سایت نوشته شده توسط زبان HTML و یا XHTML می باشد و همچنین از زبان های اسکریپت دیگری مانند plain XML، SVG و XUL نیز به خوبی پشتیبانی می نماید. در کدنویسی با استفاده از CSS می‌توانید استایل سایت مثل رنگ، فونت، تصاویر پس زمینه و … را بصورت دلخواه تغییر دهید.

هدف و کاربرد css چیست ؟

هدف از تولید css در واقع جداسازی اطلاعات محتوا (که توسط زبانی مانند HTML نوشته شده اند) از اطلاعات ظاهری مانند صفحه بندی، رنگ و سایز و نوع فونت می باشد. این جداسازی موجب افزایش سرعت در دسترسی به سایت، انعطاف پذیری بیشتر برای کنترل ویژگی های ظاهری، قابلیت طراحی چندین صفحه با یک فرمت یکسان و جلوگیری از پیچیدگی و انجام کارهای تکراری در طراحی وب سایت می گردد.

برخی از کاربردهای CSS عبارتند از:

  • تعیین ارتفاع و عرض
  • طراحی سایت رسپانسیو صفحات
  • انتخاب پس زمینه
  • انتخاب محل قرار گرفتن یک عنصر مانند متن یا عکس و…
  • تعیین چیدمان نوشته ها (چپ چین، راست چین و…)
  • مشخص کردن میزان فاصله ی عناصر از همدیگر
  • تغییر در نوع نوشتاری (فونت، رنگ و…)

ساختار کدهای css

ساختار یک کد در Css از دو قسمت تشکیل شده است:

  • انتخاب کننده (Selector)
  • بلاک اعلان (Declaration)

Selector

در صورتی که بخواهید به بخشی از html استایل خاصی دهید باید یک تگ را انتخاب کنید تا بتوانید کدهای سی اس اس را روی آن اعمال کنید.

انتخاب کننده‌های سی اس اس به چند دسته تقسیم می‌شود:

انتخاب کننده عنصر:

با استفاده از این انتخاب کننده می‌توانید تگ خاصی را انتخاب و تغییرات استایل را بر روی آن اعمال کنید به طور مثال می‌توان تگ‌ <p> در یک صفحه وب را انتخاب کرد و رنگ آن را به قرمز تغییر داد.

انتخاب کننده id :

اگر بخواهید استایل‌های CSS بر روی گروهی از تگ‌ها تعریف شود، باید از انتخاب کننده ID استفاده کنید. برای این کار باید در کدهای HTML برای تگی که قصد تغییر استایل آن‌ را دارید یک ID تعریف کنید، سپس در بخش Css آی‌دی مورد نظر را انتخاب و تغیرات را بر روی آن اعمال می‌کنید.
دستورات فقط بر روی یک ID خاص که با با علامت # در ابتدای آن مشخص میشود اعمال می‌گردد.

انتخاب کننده Class :

برای این کار باید تمام تگ‌هایی را که قصد دارید ظاهر یکسانی داشته باشند را داخل یک کلاس تعریف کنید و همانند ID به بخش CSS رفته و استایل مد نظرتان را روی آن کلاس تعریف کنید. مد نظر داشته باشید صفت کلاس با “ . “ در ابتدای آن قابل تشخیص می‌باشد.

Declaration

با استفاده از این بخش که در بین {…} قرار می‌گیرد می‎‌توانید مشخص کنید چه استایلی روی تگ‌های انتخاب شده اعمال گردد. این بخش از دو قسمت “ویژگی” و “مقدار” تشکیل شده است که باید مشخص کنید عنصر انتخاب شده چه ویژگی و چه مقداری داشته باشد. به طور مثال مشخص کنید تگ h1 به رنگ آبی و یا سایز فونت برابر ۱۴ پیکسل باشد.

stylesheet چیست؟

یک stylesheet مجموعه ای از قوانین و کدهای css است که به مرورگر می گوید که چگونه  tag HTML نمایش داده شود.

فایل css چیست؟

سی اس اس با ایجاد فایل css. همچنین شما را قادر می سازد تا نمایش صفحه مورد نظر خود را در چندین حالت مختلف Rendering مانند حالت نمایش بر روی مانیتور، حالت نمایش در زمان چاپ، در زمان حالت شناسایی صدا ( برای مرورگرهای مبتنی بر قابلیت شناسایی صدا) و همچنین برای نمایش در صفحات مرورگر موبایل را به درستی تنظیم نمایید.

اضافه کردن CSS به HTML

نحوه اتصال فایل css به فایلhtml به سه روش زیر انجام می‌شود:

  • External CSS
  • Internal CSS
  • Inline CSS

اولین نسخه از سی اس اس که توسط موسسه استاندارد سازی W3C نیز مورد تایید قرار گرفت، در دسامبر سال ۱۹۹۶ منتشر شد. این نسخه از سی اس اس از قابلیت های زیر پشتیبانی می کرد :

  •  امکان تنظیم نمودن مشخصه های فونت مانند قابلیت Fontface و Emphasis
  • امکان تغییر سایر مشخصه های متون، مانند تنظیم نمودن فاصله بین کلمات، حروف و سطرها.
  • هم تراز نمودن نوشته ها، تصاویر و جداول
  • قابلیت اضافه نمودن حاشیه، کادر و لایه بندی صفحات
  • امکان دسته بندی و نشانه گزاری مشخصه ها و امکانات وب سایت

CSS

درباره نویسنده



نظرات کاربران



دیدگاهتان را بنویسید

مطالب مرتبط



جستجو کنید ...

محصولات جدید

دوره مقدماتی تا پیشرفته CSS
تومان
190,000
دوره مقدماتی جاوا اسکریپت
تومان
199,000
دوره مقدماتی تا پیشرفته HTML
رایــگان