اینجا هستید :
خانه آموزش های طراحی وبسایت آموزش CSS آشنایی با CSS و کاربرد آن در طراحی وب

آشنایی با CSS و کاربرد آن در طراحی وب

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

سری آموزش های سی اس اس (CSS)

آشنایی با CSS

قبل اینکه بخواهیم Css  رو تعریف کنیم ، باید راجع به صفحات وب توضیح بدهیم ، یه صفحه وب شامل متن ، صوت ، تصویر و … هست. برای اینکه اجزای وب کنارهم قرار بگیرند از html استفاده می کنیم ، با استفاده از عناصر و تگ های HTML می تونیم متون ، تصاویر ، ویدئوها ، صوت ها و … رو کنار هم قرار بدیم و برای کاربرای سایت نمایش بدهیم.

از وقتی که سبک کدنویسی تغییر و پیشرفت کرد، کاربرد  Css در طراحی وب یک امر عادی بشمار اومد. با استفاده از Div ها و Css می تونید به راحتی و بسیار سبک قالب وبلاگ شخصی خود را لایه بندی و طرح بندی کنید و اجزای صفحه ی وب رو بصورت کاملا زیبا استایل بندی کنید. حالا میریم سر اصل مطلب یعنی Css اصلا چی هست؟!

تعریف و مفهوم CSS

Css مخفف Cascading Style Sheets است که در معنای لغوی به روشی گفته می شود که برای قالب بندی و طراحی اجزای صفحه وبسایت کارایی دارد. شما می توانید بدون استفاده از کدهای HTML از طریق این استایل شیت ها (Style Sheet) می توانیم از دوباره نویسی کدهای HTML که باعث مشکل شدن کدنویسی و همچنین کند شدن سرعت بارگزاری صفحه در اینترنت می شود جلوگیری کنیم.

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

در نسخه های مختلفی به بازار وب عرضه شد که در جلسه ی بعدی کاملا درباره نسخه های css صحبت می کنیم. فایل استایلها با فرمت css. ذخیره میشوند. سی اس اس از یک سری کد تشکیل شده که با استفاده از این کدها می تونید به راحتی به عناصر و کدهای HTML شمایل بدهید، به عنوان مثال می توانید تعریف کنید که سرتیتر خبر با فونت ضخیم آبی رنگ از خانواده  Tahoma نمایش داده بشه که این تعریف رو به صورت زیر مینویسید:

مزایای استفاده از CSS

طراحی ظاهر صفحات بدون استفاده از دستورات HTML

جلوگیری از تکرار دستورات

سرعت بارگذاری بیشتر برای صفحات

استفاده از فایل CSS خارجی جهت تغییر ظاهر هر تعداد صفحه ای که مایل هستیم.

طریقه نوشتن کدهای CSS

برای نوشتن دستورات CSS باید با مفاهیم زیر آشنا شویم :

  Selector
 Property
 Value

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

 

این دستور بیانگر این موضوع است که تمام متونی که با تگ h1 نوشته می شود به رنگ آبی باشند. در اینن دستور h1 همان اشاره کننده یا Selector است، عبارت color همان خصوصیت یا Property می باشد و در نهایت Blue نیز مقدار یا Value می باشد.

در این آموزش در مورد آشنایی با CSS مطالبی را آموختیم و سعی خواهیم کرد در مطالب بعدی گام به گام به آموزش های بعدی این موضوع بپردازیم.

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

مدیریت علاقه دارم در زمینه آموزش های مباحث کامپیوتری و نرم افزاری هر دانش و تجربه ای دارم با کاربران عزیز به اشتراک بزارم... ♥
منتظر نظرات خوب شما هستیم!

هنوز هیچ دیدگاهی وجود ندارد

    • سلام , مهمان