پسزمینهها
از ویژگیهای پسزمینه (به انگلیسی: background) در CSS برای تعریف حالت های (به انگلیسی: Effects) پس زمینه، برای عناصر استفاده میشود.[۱]
ویژگیهای پسزمینه در CSS:
- background-color
- background-image
- background-repeat
- background-attachment
- background-position
ویژگی background-color در CSS[ویرایش | ویرایش]
ویژگی background-color
، رنگ پس زمینه یک عنصر را مشخص میکند.
مثال[ویرایش | ویرایش]
رنگ پس زمینه یک صفحه به صورت زیر تنظیم میشود:
در CSS، رنگ معمولاً از طریق روشهای زیر مشخص میشود:
- یک نام رنگ معتبر - مانند «قرمز»
- یک مقدار HEX - مانند "#ff0000"
- یک مقدار rgb – مانند "rgb(255,0,0) "
برای مشاهده لیست کاملی از رنگهای ممکن به مقدارهای رنگ CSS مراجعه کنید.
سایر عناصر[ویرایش | ویرایش]
میتوانید رنگ پس زمینه را برای هر نوع عصر HTML تنظیم کنید:
مثال[ویرایش | ویرایش]
در اینجا، عناصر <p> ,<h1> و <div> رنگهای پس زمینه متفاوتی خواهند داشت:
کدری / شفافیت[ویرایش | ویرایش]
ویژگی opacity
میزان کدری/شفافیت یک عنصر را مشخص میکند. این ویژگی مقداری از ۰٫۰ تا ۱٫۰ را دریافت میکند. کمترین مقدار، بیشترین میزان روشنایی را دارد.
opacity
برای اضافهکردن شفافیت به پس زمینه یک عنصر استفاده میکنید، تمام عناصر فرزندش میزان یکسانی از شفافیت را به ارث میبرند. این امر موجب میشود که متن درون یک عنصر کاملاً شفاف به سختی خوانده شود.شفافیت با RGBA[ویرایش | ویرایش]
اگر نمیخواهید که میزان کدری به عناصر فرزند اعمال شود، همانند مثال بالا، از مقادیر رنگی RGBA استفاده کنید. مثال زیر میزان کدری را برای رنگ پس زمینه و نه برای متن، تنظیم میکند:
در بخش رنگهای CSS ما آموختید، که میتوان از مقادیر RGB به عنوان مقدار رنگ استفاده کرد. به علاوه RGB، میتوان از یک مقدار RGB با کانال آلفا (RGBA) - که میزان کدری را برای یک رنگ مشخص میکند، استفاده کرد.
مقدار رنگ RGBA به صورت:
rgba(آلفا، آبی، سبز، قرمز)
مشخص میشود. پارامتر alpha یک عدد بین ۰٫۰ (تمام شفاف) و ۱٫۰ (تمام کدر) است.
منابع آموزشی[ویرایش | ویرایش]