مزیت استفاده از CSS در طراحی وب سایت در مقابل ویژگی های خود تگهای html : کاملا مشخصه که اگه بخواید از attribute های خود html استفاده کنید ، بدلیل اینکه باید اونها رو در هر تگ دوباره و چندباره تکرار کنید حجم فایل html شما خیلی زیاد میشه ، در صورتی که ما با استفاده از CSS میتونیم یک دسته از صفت ها رو فقط یکبار و در یکجا تعریف کنیم و تگهای مختلف به اون دسته تنظیمات ارجاع بدن و نیازی به آوردن تنظیمات در خود تگ و اتلاف فضای بیشتر نباشه.

 با CSS کلی در اندازه ی فایل صفحه ی وبتون صرفه جویی می کنید ! خوب هر چی اندازه ی فایل وبتون کوچیکتر باشه سرعت لود شدن صفحه ی وب هم مسلما بیشتر میشه . که اینکار با CSS میسره ! تغییر دادن صفحه ی وبتون به مراتب راحتتر میشه . تنظیمات CSS رو می تونید توی فایل جداگونه بزارید و به این ترتیب استفاده و نگهداریش راحتتره !  برای درک بهتر html و css باید بگم که مثل یک ساختمانی هستند که استخون بندی آن با html و تزیینات  آن توسط css صورت میگیرد.پس قالب بندی کلی وب سایت ما توسط html صورت میگیرد و تزیین و زیبا کردن اون با css. به طور کلی به 3 شکل می تونید از CSS برای تعیین شیوه نمایش تگها ، در میان کدهای HTML استفاده کنید : 

  1- استفاده از CSS در درون تگها (inline CSS)   2- نوشتن تمامی تنظیمات CSS درون تگ Style در header صفحه اچ تی ام ال   3- نوشتن سلکتورهای CSS در فایل جداگانه و الصاق آن به صفحه HTML امروز شکل اول رو براتون توضیح می دهیم. 

1- استفاده از CSS در درون تگها (inline CSS) : شما می تونید تنظیمات و ویژگی های CSS رو در درون هر کدوم از تگ های Html بیارید تا اون تنظیمات روی تگ مربوطه اعمال بشه . برای اینکار باید ویژگی های CSS مورد نظر رو که می خواید روی تگ خاصی اعمال بشه درون ویژگی style اون تگ بیارید .  ویژگی Style برای همه تگ های Html قابل تعریفه و به عنوان مقدار ، در درون خود میتونه چندین تا از ویژگی های CSS رو که با علامت ; از هم جدا شدند بیاره !  برای درک بیشتر از چگونگی استفاده CSS در درون تگها ، چند تا مثال براتون میارم : 

 ● مثال 1)  فرض کنید می خواید فقط یکی از پاراگراف های توی صفحتون رنگ متنش قرمز بشه . - تگ داشتن یک پاراگراف معمولی به شکل زیره :  <p>آموزش </p> حالا ما می خوایم با استفاده از CSS درون این تگ ، رنگ متنشو قرمز کنیم . در این صورت کد پاراگراف بالا به شکل زیر باید تغیر پیدا کنه .  <p style = " color : red " >آموزش</p> می بینید که فقط ویژگی style به این تگ اضافه شده و به عنوان مقدار  یکی از ویژگیهای CSS که رنگ متنو مشخص می کنه آورده شده و طریقه نوشتن صفت ها هم به طریقی هستش که در مثال  میبینید. در بعضی از ویرایشگر ها با فشردن ctrl+space میتوانید لیست انواع صفت ها را مشاهده نمایید.