360搜索框是一個非常常見的搜索工具,對網站的搜索體驗起到了很大的作用。下面是其html代碼:
<div class="search-toolbox"> <form action="http://www.so.com/s" method="get" target="_blank"> <div class="search-form"> <input type="text" class="search-input" name="q" placeholder="請輸入搜索內容"> <button type="submit" class="search-btn">搜索</button> </div> </form> </div>
代碼中可以看到,搜索框主要是由一個div+form組成的,其中設置了class屬性,方便CSS樣式的設置。form中的action指定了搜索的URL地址,method為get,意味著搜索參數會以GET方式發送到搜索引擎,target="_blank"表示在新窗口中打開搜索結果。
在form中,有一個class為search-form的div,里面包含一個class為search-input的輸入框和一個class為search-btn的提交按鈕。輸入框中設置了placeholder屬性,用戶可以在輸入框中看到提示文本,提示用戶輸入內容。
通過這段代碼,我們可以方便地在需要搜索功能的網站中添加搜索框,提高用戶體驗。