2013-12-13 7 views
5

मैं अपना फॉर्म इनपुट पारदर्शी बनाने और इसे अपने div के शीर्ष पर रखने की कोशिश कर रहा हूं। असल में मैं चाहता हूं कि टेक्स्ट फ़ील्ड इसके पीछे जो कुछ भी पारदर्शी हो। कोई सुझाव?पाठ इनपुट बॉक्स पारदर्शी बनाओ? सरल होना चाहिए?

<head> 

<style type="text/css"> 
    .WRAPPER { 
    background-color: #000; 
    height: 575px; 
    width: 975px; 
    background-image: url(exit-gate/exit-gate-bg.png); 
    top: auto; 
    margin: -8px; 
    } 

    body { 
    background-color: #000; 
    } 
</style> 

<style type="text/css"> 
    term { 
    background: transparent; 
    border: none; 
    } 
</style> 

</head> 



<body> 
    <div id="WRAPPER"> 
    <div class="term"><input name="email" type="text" id="email"> 
     <form name="form1" method="post" action="insert_ac.php"> 
     <input type="image" src="exit-gate/white-box-10.png" alt="{alternate text}" name="submit" value="submit"> 
     </form> 
    </div> 
    </div> 
</body> 
</html> 
</div> 
+0

आपकी "टर्म" सीएसएस घोषणा को काम करने की कोई उम्मीद रखने के लिए ".term" होना आवश्यक है। आपकी डीओएम संरचना भी गड़बड़ हो गई है, आपके पास निश्चित रूप से आपके बंद HTML टैग के बाद "div" नहीं होना चाहिए। – DrCord

+0

@DrCord - इसे इंगित करने के लिए धन्यवाद। मैं एक नौसिखिया हूं ... इसलिए जब मैं जा रहा हूं तो चीजें गन्दा हो जाती हैं, लेकिन मैं इसे साफ़ कर दूंगा। धन्यवाद – HoustonGuy

उत्तर

8

प्रयास करें:

<input type="text" id="SI"/> 

यह मेरा इनपुट क्षेत्र, मैं इसे एक आईडी दिया जाता है:

#email { 
    background-color:rgba(0, 0, 0, 0); 
    color:white; 
    border: none; 
    outline:none; 
    height:30px; 
    transition:height 1s; 
    -webkit-transition:height 1s; 
} 
#email:focus { 
    height:50px; 
    font-size:16px; 
} 

DEMO here.

+2

मैं 'rgba' मान पर 'पारदर्शी' के साथ जाऊंगा। चूंकि पुराने ब्राउज़र ठोस रंग में डिफ़ॉल्ट होंगे। इस मामले में, काला। – Smeegs

+0

@ हिराल, धन्यवाद कि काम किया! एक और सवाल ... आप कैसे सुझाव देंगे कि मैं विज़िटर के प्रकार के टेक्स्ट, आकार और रंग को निर्दिष्ट करता हूं, और टेक्स्ट बॉक्स का आकार निर्दिष्ट करता हूं? धन्यवाद !!! – HoustonGuy

+0

@ user3089680 मैंने उत्तर संपादित किया है। [क्या आपका मतलब यह था?] (http://jsfiddle.net/pWnhN/2/) – Hiral

1

यह भी सरल लेकिन यह मेरे लिए काम किया तरीके लग रहा है (एसआई), फिर मेरे सीएसएस में:

#SI{ 
    background-color:transparent; 
} 

एसआई आईडी के साथ तत्व में पारदर्शिता जोड़ा गया; पृष्ठभूमि दिखाई दे रही है।

संबंधित मुद्दे