सीएसएस पाठ छाया
पाठ की छाया
संपत्ति पाठ में text-shadowछाया जोड़ती है।
इसके सरलतम उपयोग में, आप केवल क्षैतिज छाया (2px) और लंबवत छाया (2px) निर्दिष्ट करते हैं:
पाठ छाया प्रभाव!
उदाहरण
h1
{
text-shadow: 2px 2px;
}
अगला, छाया में एक रंग (लाल) जोड़ें:
पाठ छाया प्रभाव!
उदाहरण
h1
{
text-shadow: 2px 2px red;
}
फिर, शैडो में ब्लर इफ़ेक्ट (5px) जोड़ें:
पाठ छाया प्रभाव!
उदाहरण
h1
{
text-shadow: 2px 2px 5px red;
}
अधिक पाठ छाया उदाहरण
उदाहरण 1
एक सफेद पाठ पर पाठ-छाया:
h1 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
उदाहरण 2
लाल नीयन चमक के साथ पाठ-छाया:
h1 {
text-shadow: 0 0 3px #ff0000;
}
उदाहरण 3
लाल और नीले नीयन चमक के साथ पाठ-छाया:
h1 {
text-shadow: 0 0 3px #ff0000, 0 0 5px #0000ff;
}
उदाहरण 4
h1 {
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0
0 5px darkblue;
}
युक्ति: फ़ॉन्ट, टेक्स्ट आकार और टेक्स्ट की शैली को बदलने के तरीके के बारे में जानने के लिए हमारे सीएसएस फ़ॉन्ट्स अध्याय पर जाएं ।
युक्ति: विभिन्न टेक्स्ट प्रभावों के बारे में जानने के लिए हमारे सीएसएस टेक्स्ट इफेक्ट्स अध्याय पर जाएं।
सभी सीएसएस पाठ गुण
| Property | Description |
|---|---|
| color | Sets the color of text |
| direction | Specifies the text direction/writing direction |
| letter-spacing | Increases or decreases the space between characters in a text |
| line-height | Sets the line height |
| text-align | Specifies the horizontal alignment of text |
| text-align-last | Specifies how to align the last line of a text |
| text-decoration | Specifies the decoration added to text |
| text-indent | Specifies the indentation of the first line in a text-block |
| text-justify | Specifies how justified text should be aligned and spaced |
| text-overflow | Specifies how overflowed content that is not displayed should be signaled to the user |
| text-shadow | Specifies the shadow effect added to text |
| text-transform | Controls the capitalization of text |
| unicode-bidi | Used together with the direction property to set or return whether the text should be overridden to support multiple languages in the same document |
| vertical-align | Sets the vertical alignment of an element |
| white-space | Specifies how white-space inside an element is handled |
| word-spacing | Increases or decreases the space between words in a text |