Home > Developer > Web Develop
How to use CSS to set the shadow Effect of text:
recommendation : As far as possible handwriting code, can effectively improve the learning efficiency and depth.
Sometimes you need to add a shadow to the text, the following is a simple example of how to add a shadow effect to the text. Let's look at a code example:
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.softwhy.com/" /><title>Ant Tribe</title><styletype= "Text/css">Div, ul, Li{margin:0px;padding:0pc;List-style:None;font-size:16px;Color:#666;}a{position:relative;Display:Block;Height:25px;width:250px;Line-height:25px;text-decoration:None;Color:#666;}span{Display:None;}a:hover span{Height:25px;width:250px;Line-height:25px;Display:Block;position:Absolute; Left:-3px;Top:3px;}</style></Head><Body><Div> <ul> <Li><ahref="#">Ant Tribe welcomes You<span>Ant Tribe welcomes You</span></a></Li> <Li><ahref="#">The sun's coming out.<span>The sun's coming out.</span></a></Li> <Li><ahref="#">You can only succeed if you work hard.<span>Only by working hard can we achieve success</span></a></Li> </ul></Div></Body></HTML>
The above code is mainly to use the position positioning implementation of this function, through the display of a and span elements into block-level elements , then the A element uses relative positioning , The reference object to ensure the absolute positioning of the span element is a element, and finally the left and top properties are used to control the offset of the span element.
The original address is: http://www.softwhy.com/forum.php?mod=viewthread&tid=4646
For more information, refer to: http://www.softwhy.com/divcss/
How to use CSS to set the shadow effect of text
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
