搜索在文本框內圖標

Question

如何添加一個搜索文本框中頗爲相似，Facebook的搜索領域內的搜索圖標。我是新手，需要幫助/建議。

Answer 1

您可以通過使用CSS

#searchBox{ 
    width: 260px; 
    padding: 5px; 
    padding-right: 40px; 
    outline: none; 
    border: 2px solid #999999; 
    border-radius: 5px; 
    background-color: #FBFBFB; 
    font-family: Cambria, Cochin, Georgia, serif; 
    font-size: 16px; 
    background-position: 270px -10px; 
    background-image: url(http://www.kirupa.com/images/search.png); 
    background-repeat: no-repeat; 
} 

，這裏是你的HTML

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

Answer 2

這是那種你要找的東西做的？

Fiddle

如果所以這裏是代碼，

HTML：

<input type="text" id="search"> 

CSS：

#search { 
    width: 300px; 
    padding: 10px; 
    border: 1px solid #2189C8; 
    border-radius: 3px; 
    background: url('http://cliparts.co/cliparts/rTL/n8R/rTLn8RLBc.png') no-repeat right center; 
    background-size: 20px; 
}