Bottom қасиеті

bottom қасиеті элементтің төменгі шетінің орналасуын белгілейді. Қасиетке мәндерді жалпы қабылданған өлшем бірліктерімен жазуға болады, мысалы, пикселмен, дюйммен, пунктпен, пайызбен. Белгіленетін мәндер теріс сандар да болуы мүмкін, бұл жағдайда элементтер бір-бірінің үстіне қабаттасады. Координаттардың есебі position қасиетімен анықталады, ол әдетте relative (салыстырмалы орналасу) немесе absolute (абсолютті орналасу) мәнін қабылдайды.

Синтаксис

селектор {
	bottom: өлшем бірлігі бар сан немесе auto;
}

Мысал

Келіңіздер, бала элементке курсорды апарып қойған кезде оның төменгі шекарасының орнын 25px тең етіп белгілейік:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-top: 50px;
}
p:hover {
	bottom: 25px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Мысал

Енді бала элементтің төменгі шекарасы -50px болсын:

<div id="elem">
	<p></p>
</div>

#elem {
	width: 400px;
	height: 300px;
	border: 1px solid black;
}
p {
	position: relative;
	width: 100px;
	height: 100px;
	border: 1px solid red;
	margin-top: 50px;
}
p:hover {
	bottom: -50px;
	width: 100px;
	height: 100px;
	border: 1px solid red;
}

Сондай-ақ қараңыз

top қасиеті,
элементтің жоғарғы шетінің орнын белгілейді
left қасиеті,
элементтің сол шетінің орнын белгілейді
right қасиеті,
элементтің оң шетінің орнын белгілейді
::backdrop псевдоэлементі,
бірінші элементтен кейінгі орналасуды белгілейді
caption-side қасиеті,
кесте тақырыпшасының орнын белгілейді