HTML在搜索框中放一個放大鏡圖片

 

　　記一下簡單實現一個功能：搜索框中放一個放大鏡圖片。

 

兩種實現方式：

• 一種是HTML自帶的，將input控件的type屬性改成search就行了。
• 第二種是通過一個div盒子，使用相對定位實現，類似於幀布局，代碼很短

 

<div style="display:inline-block;position: relative">

    <input type="text" style="width: 200px;height: 30px;" placeholder="搜索">

    <a style="position: absolute;right: 0px">🔍</a>

</div>