आउटलाइन-ऑफसेट गुण

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;
}

उदाहरण . आउटलाइन + बॉर्डर का नकारात्मक मान

आप यह दिलचस्प प्रभाव बना सकते हैं (सीमाओं के बीच सफेद अंतराल की मोटाई पर ध्यान दें, यह 10px है, न कि 14, क्योंकि 4px की अपनी मोटाई के साथ outline ने इसमें से कुछ हिस्सा ले लिया):

<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 गुण,
जो रूपरेखाओं के लिए एक शॉर्टहैंड गुण है