ویژگی کوتاه‌شده

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
پرش به ناوبری پرش به جستجو
Main Page Tutorial
Css-menu.jpg
موارد آموزشی
۱خانه
۲مقدمه
۳شیوهٔ نوشتار
۴انتخابگرها
۵اضافه‌کردن CSS
۶نظرات
۷رنگ‌ها
۸پس‌زمینه‌ها
۹کادرها
۱۰حاشیه‌ها
۱۱Padding
۱۲ارتفاع/عرض
۱۳Box Model
۱۴Outline
۱۵متن
۱۶قلم‌ها
۱۷آیکن‌ها
۱۸لینک‌ها
۱۹لیست‌ها
۲۰جداول
۲۱ویژگی Display
۲۲ویژگی Max-Width
۲۳ویژگی Position
۲۴ویژگی Overflow
۲۵ویژگی Float
۲۶مقدار Inline-block
۲۷ترازکردن
۲۸ترکیب کننده‌ها
۲۹شبه کلاس
۳۰شبه عنصر
۳۱ویژگی Opacity
۳۲نوار Navigation
۳۳منو آبشاری
۳۴گالری تصویر
۳۵Image Sprites
۳۶انتخاب‌گرهای خاصیت
۳۷فرم‌ها
۳۸شمارنده‌ها
۳۹چیدمان وب‌سایت
۴۰واحدها
۴۱اولویت‌بندی
CSS پیشرفته
واکنش‌گرایی
Grid در CSS
مثال‌ها
مرجع‌ها

برای کوتاه کردن کد، می‌توان تمام ویژگی‌های پس زمینه (به انگلیسی: background) را در یک ویژگی مشخص کرد. این ویژگی، ویژگی مختصر نام دارد.[۱]

به جای نوشتن:

می‌توان از ویژگی مختصر background استفاده کرد.

مثال

از ویژگی مختصر برای تنظیم ویژگی‌های پس زمینه در یک اعلان استفاده کنید:

body {
  background: #ffffff url("img_tree.png") no-repeat right top;
}


هنگام استفاده از ویژگی مختصر ترتیب مقدار ویژگی‌ها به صورت زیر است:

  • background-color
  • background-image
  • background-repeat
  • background-attachment
  • background-position

فراموش کردن یک ویژگی، تا زمانی که سایر ویژگی‌ها به این ترتیب نوشته شوند مشکلی ایجاد نمی‌کند. دقت کنید که در مثال بالا از ویژگی background-attachment استفاده نشده است، زیرا این ویژگی مقدار ندارد.

خود را با تمرین تست کنید!

تمامی ویژگی‌های پس زمینه در CSS

ویژگی توضیحات
background تمامی ویژگی‌های پس زمینه را در یک تعریف تنظیم می‌کند
background-attachment این ویژگی را که آیا تصویر پس زمینه می‌بایست با باقی صفحات پیمایش شود یا نه را تنظیم می‌کند
background-clip محدوده رنگ پس زمینه را مشخص می‌کند
background-color رنگ پس زمینه یک عنصر را مشخص می‌کند
background-image تصویر پس زمینه یک عنصر را مشخص می‌کند
background-origin مشخص می‌کند که تصویر (های) پس زمینه باید در کدام موقعیت قرار بگیرند
background-position موقعیت آغازین یک تصویر پس زمینه را مشخص می‌کند
background-repeat نحوه تکرار تصویر پس زمینه را مشخص می‌کند
background-size اندازه تصویر (های) پس زمینه را مشخص می‌کند


منابع آموزشی