Opacity хусусияти

opacity хусусияти элементга яръим шаффофлик беради. Агар элементга яръим шаффофлик берилган бўлса - демак, ундан ўзининг ортидаги элементлар кўриниб туради.

Хусусият қиймат сифатида 0 дан 1 гача булган каср сонни қабул қилади. Бу ерда 0 қиймати - тўла шаффофлик, 1 қиймати эса тўла опақликни англатади. Ўртача қиймат, масалан 0.3, яръим шаффофликни беради. Андозага кўра қиймат: 1.

Синтаксис

селектор {
	opacity: 0 дан 1 гача сон;
}

Мисол

Бу мисолда блокка яръим шаффофлик қўшилган ва ушбу блокнинг чегараси ва матни орқали ота-онанинг фоні кўриниб турипти:

<div id="parent">
	<div id="elem">
		Lorem ipsum dolor sit amet.
	</div>
</div>

#parent {
	background-image: url("bg.png");
	background-repeat: no-repeat;
	background-size: cover;
	display: inline-block;
	padding: 30px;
}
#elem {
	width: 300px;
	height: 200px;
	border: 20px solid red;
	padding: 10px;
	font-size: 50px;
	font-weight: bold;
	color: red;
	background: black;
	opacity: 0.7;
}