पूरे डीआईवी

Question

के आसपास सीएसएस बॉक्स छाया जोड़ें क्या छाया पूरे डीवी के चारों ओर घूमना संभव है?

-moz-box-shadow: 3px 3px 3px #ccc; 
-webkit-box-shadow: 3px 3px 3px #ccc; 
box-shadow: 3px 3px 3px #ccc; 

मैं जानता हूँ कि विशेषताओं के आदेश जाता है:

• क्षैतिज ऑफसेट
• कार्यक्षेत्र ऑफसेट
• धुंधला त्रिज्या
• रंग

लेकिन मुझे आश्चर्य है कि अगर यह संभव है दिखाए जाने के बजाय छाया को इसके चारों ओर ले जाएं केवल एक किनारे या किनारे पर।

Answer 1

बस ऑफसेट्स को शून्य करें?

-moz-box-shadow: 0 0 3px #ccc; 
-webkit-box-shadow: 0 0 3px #ccc; 
box-shadow: 0 0 3px #ccc; 

Answer 2

हाँ, लंबवत या क्षैतिज ऑफसेट नहीं है, और एक अपेक्षाकृत बड़े कलंक दायरे का उपयोग करें: fiddle

इसके अलावा, आप एक से अधिक बॉक्स छाया का उपयोग कर सकते हैं यदि आप उन्हें अल्पविराम से पृथक करते। यह आपको ठीक से ट्यून करने की अनुमति देगा जहां वे धुंधला हो जाएंगे और वे कितना विस्तार करेंगे। उदाहरण मैं प्रदान एक बड़ी outline से पृथक है, लेकिन यह काफी अधिक फ़ाइन-ट्यून जा सकता है: fiddle

आप box-shadow का अंतिम और सबसे प्रासंगिक संपत्ति है, जो spread-distance है याद किया। आप कितना छाया विस्तृत करता है या अनुबंधों के लिए एक मूल्य निर्दिष्ट कर सकते हैं (मेरी दूसरी उदाहरण अप्रचलित बनाता है): fiddle

पूर्ण संपत्ति सूची है:

बॉक्स छाया: [क्षैतिज ऑफसेट] [खड़ी ऑफसेट] [धुंध-त्रिज्या] [फैलाव दूरी] [रंग] इन्सेट?

लेकिन इससे भी बेहतर, spec के माध्यम से पढ़ें।

Answer 3

बस नीचे दिए गए कोड का उपयोग करें। यह संपूर्ण DIV

-webkit-box-shadow: -1px 1px 5px 9px rgba(0,0,0,0.75); -moz-box-shadow: -1px 1px 5px 9px rgba(0,0,0,0.75); box-shadow: -1px 1px 5px 9px rgba(0,0,0,0.75);

आशा घेर शैडो होगा इस