CSS арын шинж чанаруудыг элементүүдийн арын эффект нэмэхэд ашигладаг.
background-colorbackground-imagebackground-repeatbackground-attachmentbackground-positionbackground
CSS Арын өнгө #
background-color нь элементийн арын өнгийг тодорхойлдог.
Хуудасны арын өнгийг дараах байдлаар тохируулаж болно.
body {
background-color: lightblue;
} CSS-ийн тусламжтайгаар өнгийг дараахь байдлаар тодорхойлдог.
- “улаан” гэх мэт өнгөний нэр
- “# ff0000” шиг HEX утга
- “rgb (255,0,0)” шиг RGB утга
h1 {
background-color: green;
}
div {
background-color: lightblue;
}
p {
background-color: yellow;
} Тунгалаг биш / #
Тунгалаг байдал #
opacity property нь элементийн тунгалаг / тунгалаг биш байдлыг тодорхойлдог. Энэ нь 0.0 – 1.0 хоорондох утгыг авах боломжтой. Бага утга, илүү ил тод:
opacity 1
opacity 0.6
opacity 0.3
opacity 0.1
div {
background-color: green;
opacity: 0.3;
} Тэмдэглэл: opacityшинж чанарыг элементийн дэвсгэр дээр ил тод байдлыг нэмэхийн тулд түүний бүх элементүүд ижил тунгалаг чанарыг өвлөн авдаг. Энэ нь бүрэн ил тод элементийн доторх текстийг уншихад хэцүү болгодог.
RGBA ашиглах тунгалагжилт #
Хэрэв та дээр дурдсан жишээний адил хүүхдийн элементүүдэд тунгалаг бус байдлыг ашиглахыг хүсэхгүй бол RGBA өнгөний утгыг ашиглаарай. Дараах жишээ нь текстийг биш харин дэвсгэрийн өнгийг тунгалаг биш болгож өгдөг.
100% opacity
60% opacity
30% opacity
10% opacity
Та RGB-г өнгөний утга болгон ашиглаж болохыг манай CSS Colors бүлгээс мэдэж авлаа. RGB-ээс гадна та өнгөт тунгалаг байдлыг тодорхойлдог альфа суваг (RGBA) бүхий RGB өнгөний утгыг ашиглаж болно.
RGBA өнгөний утгыг дараах байдлаар зааж өгсөн болно: rgba (улаан, ногоон, цэнхэр, альфа). Альфа параметр нь 0.0 (бүрэн тунгалаг) ба 1.0 (бүрэн тунгалаг бус) хоорондох тоо юм.
div {
background: rgba(0, 128, 0, 0.3) /* Green background with 30% opacity */
} 
