
در اولین قسمت از فیلم آموزش CSS اول CSS را معرفی کرده ایم و سپس نحوه اتصال CSS به HTML را آموزش داده ایم . اول از هر چیز باید بدانید که CSS چیست ؟
CSS چیست ؟
CSS مخفف Cascading Style Sheet است و به معنی شیوه نامه آبشاری هستش و جزء زبان های طراحی وب محسوب میشود و این امکان را به طراحان وب میدهد تا فایل HTML خود را استایل دهی کنند .
برای اطلاعات بیشتر ، تاریخچه و نسخه های مختلف CSS کلیک کنید .
سینتکس CSS :
سینتکس یک زبان یعنی نحوه نوشتن آن زبان ، سینتکس زبان CSS به صورت عکس زیر است :

سینتکس CSS
اول سلکتور ( انتخابگر ) را مشخص می کنیم بعد آکولاد باز و بسته و کد های CSS رو داخل اون می نویسیم و اون هارو با سیمی کالون ( ; ) از هم جدا میکنیم .
نکاتی باید در نوشتن CSS رعایت کنید :
1 . نام سلکتور نباید با رقم های 0 تا 9 شروع شود .
2 . هر تعداد ویژگی ( Property ) زبان CSS رو که می خواهید بنویسید باید آن ها را داخل { } بنویسید .
3 . اگر خواستید بیش از یک ویژگی برای یک سلکتور بنویسید حتماً باید با سیمی کالون آن ها را از هم جدا بکنید .
سلکتور ها دو نوع هستند : سلکتورهای عمومی و سلکتور های اختصاصی
سلکتور های عمومی همان تگ های html هستند که می خواهید به آن ها استایل بدهید و سلکتور های اختصاصی هم سلکتور هایی هستند که با Class و Id مشخص میشوند . در ادامه با این ها بیشتر آشنا میشوید .
نحوه اتصال CSS به HTML
در فیلم آموزش CSS ما سه روشی که بیشتر برای وصل کردن CSS به HTML استفاده می شود را برای شما گفته ایم .
روش اول : اکسترنال
در این روش یک فایل جداگانه برای CSS درست می کنیم و اون رو به فایل HTML وصل می کنیم همانند کد زیر ، این روش بیش تر استفاده می شود چون کد نویسی مرتب و تمیزی خواهیم داشت :
<!doctype html> <html> <head> <title>Web30ty.com</title> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> </body> </html>
همان طور که می بینید در داخل کد های HTML و در فسمت head یک تگ link نوشته ایم برای اتصال CSS به HTML و خاصیت rel نوع رابطه را مشخص می کند و type نوع فایلی که می خواهیم به html وصل کنیم را مشخص می کند و href هم آدرس فایل CSS را مشخص می کند .
روش دوم : اینترنال
در این روش با استفاده از تگ Style در داخل تگ head به html استایل می دیم به صورت زیر :
<!doctype html> <html> <head> <title>Web30ty.com</title> <style> h1{ color: #ff0; } </style> </head> <body> <h1> Web30ty </h1> </body> </html>
روش سوم : روش خطی
یعنی در هر کدام از تگ هایی می نویسید می توانید به آن تگ در همان خط استایل بدید مانند سورس کد زیر :
<!doctype html> <html> <head> <title>Web30ty.com</title> </head> <body> <h1 style="color: #ff0;"> Web30ty </h1> </body> </html>
توضیحات بیشتر در فیلم آموزش CSS چیست داده شده است .
سلام خدمت استاد عزیز ضمن عرض خسته نباشید بابت سایت عالیتون میخواستم بگم که قسمت های اول و سوم وپنجم و بیستو یکم اموزش cssدانلود نمیشه خواهشمندم که پی گیری کنید خیلی ممنون
سلام خیلی ممنون که گفتین ، همه اونایی رو که گفتین درست کردم الان می تونید دانلود بکنید .
سلام خسته نباشید
اتصال css به html از سه طریق بود من دو روش میتونم وصل بشم اما روش اکسترنال اصلا وصل نمیشه میتونید راهنماییم کنید…
سلام
تو فیلم آموزشی هر سه روش کامل توضیح داده شده هر کجاش مشکل داشتید بگید کمکتون کنم
سلام استاد خدا قوت . . . استاد شما کی اموزش ساخت قالب رو در سایت عزیز web 30ty می گذارید؟
سلام
دارم ضبط میکنم ان شالله از هفته آینده بر روی سایت قرار میگیره .
خوب بود
واقعا عالی بود،کلی روش امتحان کردم نشدولی این روش عالی بود💚