text-stroke-width प्रॉपर्टी
text-stroke-width प्रॉपर्टी टेक्स्ट के करैक्टर्स के आउटलाइन
या स्ट्रोक की चौड़ाई सेट करती है। यह प्रॉपर्टी
px, em, rem आदि जैसी यूनिट्स में
दिए गए वैल्यूज लेती है। निम्नलिखित वैल्यूज भी दिए जा सकते हैं:
thin (पतली लाइन), medium (मध्यम लाइन) और
thick (मोटी लाइन)।
सिंटैक्स
सेलेक्टर {
text-stroke-width: नंबर या thin या medium या thick;
}
उदाहरण
आइए अपने टेक्स्ट के करैक्टर्स को एक पतला स्ट्रोक दें:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
-webkit-text-stroke-color: orange;
-webkit-text-stroke-width: thin;
text-stroke-width: thin;
color: white;
font-size: 10em;
margin-top: 0;
font-weight: bold;
font-family: Arial;
}
:
उदाहरण
और अब पतले स्ट्रोक को मध्यम स्ट्रोक में बदलते हैं:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
-webkit-text-stroke-color: orange;
-webkit-text-stroke-width: medium;
text-stroke-width: medium;
color: white;
font-size: 10em;
margin-top: 0;
font-weight: bold;
font-family: Arial;
}
:
उदाहरण
आइए अपने टेक्स्ट के करैक्टर्स को एक मोटा स्ट्रोक दें:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
-webkit-text-stroke-color: orange;
-webkit-text-stroke-width: thick;
text-stroke-width: thick;
color: white;
font-size: 10em;
margin-top: 0;
font-weight: bold;
font-family: Arial;
}
:
उदाहरण
साथ ही, आइए अपने टेक्स्ट के करैक्टर्स को
2px का स्ट्रोक दें:
<p>
Text
</p>
body {
width: 100px;
height: 50px;
}
p {
-webkit-text-stroke-color: orange;
-webkit-text-stroke-width: 2px;
color: white;
font-size: 10em;
margin-top: 0;
font-weight: bold;
font-family: Arial;
}
:
यह भी देखें
-
text-strokeप्रॉपर्टी,
जो टेक्स्ट स्ट्रोक सेट करती है -
text-stroke-colorप्रॉपर्टी,
जो टेक्स्ट स्ट्रोक का रंग सेट करती है