026-32601

آموزش CSS

زبانCSSاین امکان را به طراحان سایت می دهد تا کدهای اچ تی ام ال خود را از لحاظ بصری زیبا و چشمگیر کنند. پس از فراگیری نحوه استفاده از تگ های HTML، اساسی ترین گام یادگیری استفاده از کدهای سی اس اس است چرا که امروزه کمتر سایتی را می توان یافت که صرفاً با استفاده از زبان اچ تی ام ال طراحی شده باشد.

CSSکه مخفف واژگانCascading Style Sheetsبه معنای "الگو های آبشاری" است را می توان برای طراحی اجزای صفحه از قبیل متن، تصویر، زمینه صفحه، کادرها و تقریباً هر چیزی که در طراحی صفحه استفاده می شودبه کار برد.

سی اس اس به زبان ساده برای نمایش چیدمان و جلوه‌های تصویری (مانند نوع قلم، رنگ و اندازه‌ها)، زیبایی جهت طراحي انواع سبک يا استايل براي صفحه هاي وب مورد استفاده قرار می گیرد.

با استفاده از کدهايCSS همچون font-size، font-weight، font-style، font-variant،text-align، border-radius، background-color، box-shadow و ... ميتوان براي صفحه وب طرح‌ها و قالب‌هاي متنوعي طراحي کرد.

از مهمترین مزایایCSSمیتوان به انعطاف پذیری بالای کدهای سی اس اس، کم حجم کردن فایل های HTML و بالتبع آن پایین آمدن مدت زمان بارگذاری صفحه، هماهنگی راحت تر نمایش ظاهر سایت در مرورگر های مختلف، امکان طراحی سایت به صورت Responsive یا "واکنش گرا" و ... نام برد.

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

نمایش # 
عنوان
سی اس اس (CSS) چیست؟
تاریخچه سی اس اس (CSS)
آشنایی با ساختار کدهای سی اس اس (CSS)
نحوه لینک دادن به یک فایل سی اس اس (CSS) در یک فایل اچ تی ام ال (HTML)
نحوه نوشتن کدهای سی اس اس (CSS) به صورت Internal در صفحات اچ تی ام ال (HTML)
اضافه کردن کدهای سی اس اس (CSS) به صورت Inline در تگ های اچ تی ام ال (HTML)
سلسله مراتب اجرای کدهای سی اس اس (CSS)
آشنایی با Selector های سی اس اس (CSS)
نحوه اختصاص id و class به برخی تگ های اچ تی ام ال (HTML)
آشنایی با Descendant Selector ها در سی اس اس (CSS)
آشنایی با Child Selector ها در سی اس اس
آشنایی با Adjacent Selector ها در سی اس اس (CSS)
آشنایی با Attribute Selector ها در سی اس اس (CSS)
آشنایی با مفهوم DOM در سی اس اس (CSS)
گروه بندی کردن Selector ها در سی اس اس (CSS)
Inheritance یا وراثت در کدهای سی اس اس (CSS)
استفاده از دستور important برای جلوگیری از هم پوشانی کدهای سی اس اس (CSS)
اختلاف در نحوه نمایش کدهای سی اس اس (CSS) در مرورگرهای مختلف
نحوه کامنت گذاری در کدهای سی اس اس (CSS)
معرفی Property یی تحت عنوان font-family در سی اس اس (CSS)
آشنایی با دستور @font-face در سی اس اس (CSS)
معرفی Property یی تحت عنوان font-size در سی اس اس (CSS)
معرفی Property یی تحت عنوان font-weight در سی اس اس (CSS)
معرفی Property یی تحت عنوان font-style در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان font-variant در سی اس اس (CSS)
نحوه خلاصه نویسی کدهای مرتبط با font در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان font-transform در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان text-align در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان text-indent در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان text-decoration در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان letter-spacing در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان word-spacing در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان line-height در سی اس اس (CSS)
نحوه استفاده از گرادیانت به جای رنگ
آشنایی با Box Model در سی اس اس (CSS)
آشنایی با padding در سی اس اس (CSS)
آشنایی با margin در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان border در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان border-radius در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان background در سی اس اس (CSS)
آشنایی با رنگ ها در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان color در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان background-image در سی اس اس (CSS)
نحوه به کارگیری چندین تصویر پس زمینه در سی اس اس (CSS)
نحوه خلاصه نویسی کدهای مرتبط با background در سی اس اس (CSS)
آشنایی با مفاهیم طراحی Layout از طریق سی اس اس (CSS)
آشنایی با absolute در طراحی Layout با سی اس اس (CSS)
آشنایی با fixed در طراحی Layout با سی اس اس (CSS)
آشنایی با Property یی تحت عنوان float در سی اس اس (CSS)
آشنایی با Attribute یی تحت عنوان clear در سی اس اس (CSS)
آشنایی با Property یی تحت عنوان opacity در سی اس اس (CSS)
آشنایی با Property های box-shadow و text-shadow در سی اس اس (CSS)
سخن پایانی

آخرین مطالب