सीएसएस

Question

के साथ ड्रॉपशैडो मैं अपने div में एक पारदर्शी ड्रॉपशैड जोड़ना चाहता हूं। मेरे पास एक कंटेनर है, और इसके पीछे मैं एक बूंद छाया डालना चाहता हूं। मैं नहीं चाहता कि ड्रॉपशैडो का रंग हो। यह वही है मैं अब तक है:

.content_right1{ 

    background:#fff; 

    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    border-radius:10px; 

    -moz-box-shadow: 5px 5px 5px #99CCFF; 
    -webkit-box-shadow: 5px 5px 5px #99CCFF ; 
    box-shadow: 5px 5px 5px #99CCFF; 

    /* other styles of the class */ 
    width:380px; 
    float:left; 

    margin-left:3px; 
    padding:15px; 

    min-height:450px; 
    margin-left:15px; 
} 

मैं अस्पष्टता जोड़ना चाहते हैं, लेकिन जब मैं पूरे div परिवर्तन की अस्पष्टता है।

Answer 1

जबकि आपका प्रश्न आखिरकार थोड़ा अपारदर्शी (पन इरादा) है, तो क्या आप निम्न की अपेक्षा करते हैं?

-moz-box-shadow: 5px 5px 5px #dddddd; 
-webkit-box-shadow: 5px 5px 5px #dddddd; 
box-shadow: 5px 5px 5px #dddddd; 

http://jsfiddle.net/zCTC8/2/

सभी मैं अनिवार्य रूप से किया था छाया है, जो घोषणा (#dddddd, या #ddd) में अंतिम मान है की रंग मान समायोजित किया गया था। ये हेक्स मान हैं। यहाँ और अधिक उदाहरण के लिए देखें:

http://html-color-codes.com/

#ddd/#dddddd एक हल्के भूरे रंग के रंग प्रतिनिधित्व करता है; #eee हल्का है, #ccc गहरा है, #fff सफेद है, और #000 काला है। मूल्य #000,, RGB का प्रतिनिधित्व करता है 0-9A-F (अंधेरे> प्रकाश) की मान्य मान के साथ इतना है कि:

#f00 = red (R) 
#0f0 = green (G) 
#00f = blue (B) 

मूल्य #99CCFFfrom your question#9CF के बराबर है, जो एक मध्यम लाल (9) देता है, एक हल्का हरा (सी), और सफेद (एफ)। इन मूल्यों का मिश्रण आपको हल्का नीला छाया देता है जो आप देख रहे थे, यही कारण है कि आप "छाया जैसी" रंग (ग्रे छाया) के बजाय रंग प्राप्त कर रहे थे।

मेरा रंग सिद्धांत यहां थोड़ा जंगली है, इसलिए अगर कोई मुझे कुछ फहराता है तो कोई मुझे सही करता है।

Answer 2

आप अस्पष्टता के स्तर के साथ एक dropshadow चाहते हैं, आप अपनी छाया रंग के लिए RGBA() का उपयोग करना चाहिए:

http://css-tricks.com/2151-rgba-browser-support/

संपादित करें:

-moz-box-shadow:5px 5px 5px rgba(0,0,0,0.3); 
-webkit-box-shadow:5px 5px 5px rgba(0,0,0,0.3); 
box-shadow:5px 5px 5px rgba(0,0,0,0.3);