outline-offset сипаттамасы

outline-offset сипаттамасы орын алмайтын сыртқы жиектің кеңістігін белгілейді. Сипаттама мәні ретінде пайыздардан басқа кез келген өлшем бірліктері қолданылады. Әдепкі мән: 0. Оң мән жиекті элементтен сыртқа қарай ығыстырады, теріс мән ішке қарай.

Синтаксис

селектор {
	outline-offset: мән;
}

Мысал . Оң мән

Жиек элементтен (ол фонмен бөлектелген) сыртқа қарай ығысқан:

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

#elem {
	outline-offset: 5px;
	outline-width: 1px;
	outline-style: solid;
	outline-color: black;
	background-color: #e4f1ed;
	width: 300px;
	height: 100px;
}

Мысал . Теріс мән

Жиек элемент ішінде орналасқан:

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

#elem {
	outline-offset: -10px;
	outline-width: 1px;
	outline-style: solid;
	outline-color: black;
	background-color: #e4f1ed;
	width: 300px;
	height: 100px;
}

Мысал . outline + border теріс мәні

Мұндай қызықты әсерді жасауға болады (шектер арасындағы aқ аралықтың қалыңдығына назар аударыңыз, ол 10px, 14 емес, себебі оның бір бөлігін outline өзінің 4px қалыңдығымен жейді):

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

#elem {
	outline-offset: -14px;
	outline: 4px solid green;
	border: 4px solid red;
	width: 300px;
	height: 100px;
}

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

outline-width сипаттамасы,
жиек қалыңдығын белгілейді
outline-style сипаттамасы,
жиек стилін белгілейді
outline-color сипаттамасы,
жиек түсін белгілейді
outline сипаттамасы,
жиектер үшін қысқартылған сипаттама