Шаффафӣ тавассути хосияти opacity дар CSS

Шаффафии элементро инчунин метавон тавассути хосияти 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;
	padding: 10px;
	font-size: 50px;
	font-weight: bold;
	
	border: 20px solid red;
	background: black;
	color: red;
	
	opacity: 0.7;
}

Фарз кунем, ки шумо як акси замина доред. Дар болои он ду блок бо матн, ҳудуд ва замина ҷойгир кунед. Дар ин блокҳо фарқи байни шаффафии тавассути opacity ва тавассути rgba -ро нишон диҳед.