3在文本框中點擊圖標

我想在文本框3個點擊圖標能有人支持我這個3在文本框中點擊圖標

我找到了一個可點擊的圖標這段代碼我想更多的圖標，但無法正常工作

#form1 div { 
 
    position: relative; 
 
    width: 400px; 
 
    padding: 5px; 
 
    border: 1px solid #000; 
 
    overflow: hidden 
 
} 
 

 
#form1 label { 
 
    float: left; 
 
    text-align: right; 
 
    width: 80px; 
 
    padding: 0 20px; 
 
} 
 

 
#form1 input { 
 
    width: 200px; 
 
    padding: 5px 40px 5px 5px; 
 
    float: left; 
 
} 
 

 
#form1 a { 
 
    float: left; 
 
    margin: 2px 0 0 -32px; 
 
    text-decoration: none; 
 
    width: 30px; 
 
    height: 25px; 
 
    background: transparant; 
 
    position: relative; 
 
    z-index: 99; 
 
}

<form id="form1" method="post" action=""> 
 
    <div> 
 
    <label for="text">Enter text:</label> 
 
    <input type="text" name="text" id="text" /> 
 
    <a href="http://www.pmob.co.uk"><img src="/user/icos/6.gif" border="none"> 
 
    </a> 
 
    </div> 
 
</form>

來源

2017-09-08 Jan Jan Molendijk

什麼^他希望通過使用''雖然這不是把圖標你是如何做到的。 OP如果你想在文本框中添加圖標，使用'：before'和'：after：' –

Ovidiu你有我的例子嗎？ –

如果您想要使用圖標，請使用僞選擇器：before和：after和margin：2px 0 0 -32px;由於此圖標重疊而刪除。 –

這個怎麼樣???

sample screenshot

<form id="form1" method="post" action=""> 
    <div> 
    <label for="text">Enter text:</label> 
    <input type="text" name="text" id="text" /> 
    <a href="http://www.url.com"><img src="/folder/img/name.png" height="20" width="20"> 
    </a> 
    </div> 
    <input type="submit" value="submit"/> 
    </form>

您可以從這裏展開，看看圖片....如果那是你想要

來源

2017-09-08 05:49:32

謝謝你支持Kiyoshi，但我希望他們進入

@JanJanMolendijk你想讓圖標出現在文本框內嗎？ –

@Kiyoshi是的所有3個關閉他們在文本框內（在最後右） –

3在文本框中點擊圖標

回答

相關問題