مثال های کاربردی CSS
نحوه ایجاد توضیحات یا کامنت در CSS
نحوه استفاده از روش خطی یا Inline سی اس اس
نحوه استفاده از روش داخلی یا Internal سی اس اس
نحوه اتصال فایل CSS خارجی به صفحه HTML ( آدرس دهی مطلق )
نحوه اتصال فایل CSS خارجی به صفحه HTML ( آدرس دهی نسبی )
تنظیم رنگ زمینه برای صفحه
تنظیم رنگ متن یک عنصر
تنظیم تصویر زمینه برای صفحه
نحوه فیکس کردن تصویر زمینه
ترکیب رنگ با تصویر زمینه ( ایجاد فیلتر رنگی )
نحوه تنظیم اندازه یا سایز تصویر زمینه
نحوه تکرار تصویر زمینه
تنظیم نقطه شروع برای پاشیدن تصویر زمینه
میزان گسترش یافتن یا پخش شدن رنگ یا تصویر زمینه
ایجاد خط بوردر به بالای عنصر
ایجاد خط بوردر به سمت راست عنصر
ایجاد خط بوردر به سمت چپ عنصر
ایجاد خط بوردر به پایین عنصر
قرار دادن تصویر بجای خط / برای کشیدن به دور لبه های عنصر
گِرد کردن لبه های یک عنصر
گرد کردن لبه های تصویر
گرد کردن فقط گوشه بالا سمت راست عنصر
گرد کردن فقط گوشه بالا سمت چپ عنصر
گرد کردن فقط گوشه پایین سمت چپ عنصر
گرد کردن فقط گوشه پایین سمت راست عنصر
تک خطی کردن خط دور لبه های جدول
پایین قرار دادن کپشن یا Caption جدول
نحوه فیکس کردن اندازه سلول های جدول
شناور کردن تصویر به سمت راست
شناور کردن تصویر به سمت چپ
جلوگیری از سَرریز شدن عناصر در یک باکس ( روش پیشنهادی )
جلوگیری از سَرریز شدن عناصر در یک باکس ( روش دوم )
چسبوندن یک باکس به بالای مرورگر ، وقتی به سمت پایین اسکرول میکنیم
گذاشتن تصویر در گوشه پایین سمت چپ صفحه
گذاشتن تصویر در گوشه پایین سمت راست صفحه
گذاشتن تصویر در گوشه بالا سمت چپ صفحه
گذاشتن تصویر در گوشه بالا سمت راست صفحه
تعریف و فراخوانی فونت فارسی در صفحه وب
تنظیم اندازه یا سایز فونت
نحوه کج یا ایتالیک کردن متن
نحوه تنظیم وزن فونت ( میزان کلفتی )
ایجاد فاصله بین حروف متن
ایجاد فاصله بین کلمات متن
تبدیل حروف کوچک انگلیسی به حروف بزرگ و برعکس
ایجاد سایه بروی متن
ایجاد سایه بروی باکس عنصر
ایجاد فاصله بین لاین یا سطرهای متن
تنظیم تراز متن بصورت افقی ( چپ ، وسط و راست )
تنظیم میزان تورفتگی متن
تنظیم نحوه شکسته شدن کلمات طولانی به سطرهای بعد
تنظیم نحوه سَرریز شدن محتوا
کشیدگی متن بطوری که کل فضای سطرهارو بپوشاند ( justify )
قرار دادن تصویر در وسط صفحه ( روش اول )
قرار دادن تصویر در وسط صفحه ( روش دوم )
کشیدن خط بروی متن یا به زیر متن
حذف خط زیر لینک
تقسیم محتوا به چندین ستون از متن ( همانند روزنامه ها )
تنظیم استایل خط بین ستون های متن
تنظیم اندازه عرض یا width یک عنصر
تنظیم اندازه ارتفاع یا height یک عنصر
تنظیم بیشترین اندازه عرض یا max-width یک عنصر
تنظیم بیشترین اندازه ارتفاع یا max-height یک عنصر
تنظیم کمترین اندازه عرض یا min-width یک عنصر
تنظیم کمترین اندازه ارتفاع یا min-height یک عنصر
چرخش 360درجه تصویر وقتی ماوس روش قرار میگیره
وسط قرار دادن یک باکس با استفاده از ویژگی Margin
وسط قرار دادن یک باکس با استفاده از ویژگی Transform
نحوه استفاده از ویژگی Transition
وقتی ماوس بروی باکس قرار میگیرد ،باکس چندبرابر بزرگتر میشود
قرار دادن تصویر بجای خط، به دور لبه های یک عنصر
نحوه استفاده از ویژگی Padding
نحوه استفاده از ویژگی Margin
نحوه استفاده از ویژگی box-sizing برای تفکیک اندازه ها از همدیگر
تنظیم رنگ مکان نمای ماوس
برش زدن عناصر با استفاده از ویژگی clip
قرار دادن محتوای دلخواه به قبل و بعد از یک عنصر
ایجاد شمارنده خودکار به متن در صفحه
ایجاد شمارنده خودکار به آیتم های یک لیست
ایجاد شمارنده خودکار به سلول های یک جدول
ایجاد شمارنده خودکار به تیتر + زیرتیتر های موجود در صفحه
تنظیم شکل اشاره گر ماوس
راست چین کردن صفحه با استفاده از ویژگی direction
مخفی کردن یک عنصر ( متن )
مخفی کردن یک عنصر ( تصویر )
مخفی کردن یک باکس ( جوری که جاش در صفحه باقی میمونه )
ایجاد فیلترهای رنگی بروی عناصر
نحوه وارد کردن یا ایمپورت کردن فایل CSS به یک فایل CSS دیگر
نحوه استفاده از ویژگی Media@
نحوه مخلوط کردن رنگ زمینه با تصویر زمینه
تنظیم میزان شفافیت عنصر
نحوه واکنش گرا کردن جدول
وقتی بروی لینک کلیک میشود بصورت نرم اسکرول میشود
انتخاب کل محتوای یک باکس به محض کلیک بروی آن
تنظیم رنگ لینک در حالت های مختلف
تنظیم شکل علامت گذاری آیتم های یک لیست
نحوه فراخوانی کلاس یا Class در CSS
نحوه فراخوانی آی دی یا ID در CSS
فراخوانی یا انتخاب دسته جمعی تگ ها در CSS
انتخاب حرف اول از یک متن در CSS
انتخاب سطر اول از یک متن در CSS
لیست کامل انتخابگرهای CSS در اینجا
ایجاد یک منوی افقی ساده
ایجاد یک منوی عمودی ساده
منوی افقی بهمراه زیر آیتم ( با تگ UL )
منوی افقی بهمراه زیر آیتم ( با تگ Div )
فیکس کردن منوی افقی در بالای صفحه در هنگام اسکرول
فیکس کردن منوی افقی در پایین صفحه در هنگام اسکرول
منوی عمودی بهمراه زیر آیتم

استفاده از محتویات این صفحه برای عموم آزاد می باشد. [سایت آموزشی فری لرن]