女人让男人桶爽30分钟,精品一区二区,在线观看 ,久久久久亚洲精品,免费网站看av片,男女啪啪18禁无遮挡激烈

您好！歡迎來到源碼碼網(wǎng)！

HTML在如何在透明輸入框里添加圖標(biāo)的代碼實現(xiàn)過程

  • 軟件教程
  • 來源：源碼碼網(wǎng)
  • 編輯：admin
  • 時間：2021-01-31 22:22
  • 閱讀：1038

文章主要介紹了HTML在透明輸入框里添加圖標(biāo)的代碼實現(xiàn)過程，代碼簡單易懂，非常不錯對大家的學(xué)習(xí)或工作具有一定的借鑒和參考價值，需要的朋友參考下吧

最近在寫一個律師推薦前臺的網(wǎng)站，在上面搜索框這里出現(xiàn)了問題，我想把搜索的圖標(biāo)放在搜索框里面，但是弄了半天都不大如意……

話不多說，我們直接進(jìn)入主題 ：

基本思路

其實就把輸入框與后面的圖標(biāo)一起放在一個div里面，然后將輸入框的border設(shè)置為0px，最后設(shè)置div的border為最終的外邊框

我們最直接上代碼：

HTML：

<div class="search">
        <form action=http://baidu.com>
           <input type="text" placeholder="請輸入查找的律師或?qū)ｉL">
               <span>
                 <a href="#"><img src="img/icon1.png" alt=""></a>
               </span>
          </form>
</div>

CSS：

這里是設(shè)置外面整個div的樣式

.search {
    width: 250px;
    height: 35px;
    border: 1px solid white;
    border-radius: 30px;
}

這里是設(shè)置里面的輸入框的長寬、boder為0px、里面的字體大小、點(diǎn)擊不會亮邊框(outline:none)

設(shè)置透明度這里使用rgba()，最后一個屬性就是透明度（在0-1之間）

input {
    width: 200px;
    height: 35px;
    border: 0;
    font-size: 14px;
    outline: none;
    background-color: rgba(255, 255, 255, 0);
    color: white;
    font-size: 16px;
    margin: 0 10px;

小伙伴們有沒有g(shù)et到，是不是很簡單呢？關(guān)注源碼碼網(wǎng)，學(xué)習(xí)更多的開源代碼。

特別聲明：
1、如無特殊說明，內(nèi)容均為本站原創(chuàng)發(fā)布，轉(zhuǎn)載請注明出處；
2、部分轉(zhuǎn)載文章已注明出處，轉(zhuǎn)載目的為學(xué)習(xí)和交流，如有侵犯，請聯(lián)系客服刪除；
3、編輯非《源碼碼網(wǎng)》的文章均由用戶編輯發(fā)布，不代表本站立場，如涉及侵犯，請聯(lián)系刪除；
全部評論(0)
推薦閱讀
  • CSS 媒體查詢(@media)寬度范圍設(shè)置建議
  • CSS 媒體查詢(@media)寬度范圍設(shè)置建議
  • 語法正確性：代碼使用現(xiàn)代范圍查詢語法(width>=1200pxandwidth<1400px)，在支持該語法的瀏覽器（如Chrome104+、Firefox63+、Safari15.4+）中有效。邏輯正確性：當(dāng)視口寬度在1200px（含）至1400px（不含）之間時，body的padding-top會設(shè)置為4px，符合用戶需求。兼容性建議：傳統(tǒng)寫法：為兼容舊版瀏覽器，建議改用：@media?(w
  • 源碼教程
  • 來源：源碼碼網(wǎng)
  • 編輯：源碼碼網(wǎng)
  • 時間：2025-05-06 21:55
  • 閱讀：81
  • VS Code配置Vue自動補(bǔ)全代碼教程
  • VS Code配置Vue自動補(bǔ)全代碼教程
  • 在VSCode中配置Vue開發(fā)的自動補(bǔ)全代碼可以通過以下步驟實現(xiàn)，以提高開發(fā)效率：1.安裝必要插件Volar(推薦用于Vue3)針對Vue3和語法，提供更強(qiáng)大的支持。Vetur(適用于Vue2)若項目使用Vue2，安裝Vetur并禁用Volar以避免沖突。VueVSCodeSnippets提供常用代碼片段（如v-for,?v-model等）。2.配置VSCode設(shè)
  • 源碼教程
  • 來源：源碼碼網(wǎng)
  • 編輯：源碼碼網(wǎng)
  • 時間：2025-04-21 21:35
  • 閱讀：189
  • 中文域名有價值嗎？他的優(yōu)缺點(diǎn)是什么？
  • 中文域名有價值嗎？他的優(yōu)缺點(diǎn)是什么？
  • 中文域名（如“例子.中國”或“news.新華網(wǎng)”）作為互聯(lián)網(wǎng)本地化的重要體現(xiàn)，近年來在特定場景下展現(xiàn)了獨(dú)特的價值，但也存在爭議和局限性。以下從多個角度分析其價值與挑戰(zhàn)：1.核心價值點(diǎn)（1）用戶友好性與品牌本土化降低記憶門檻：對中文用戶而言，母語域名更直觀易記，尤其適合面向非英語用戶的中小企業(yè)、地方機(jī)構(gòu)或中老年群體。例如，“新華網(wǎng).中國”比“xinhuanet.com”更容易被普通用戶記住。強(qiáng)化品牌標(biāo)識：中文域名可直接體現(xiàn)品牌名稱（如“
  • 行業(yè)資訊
  • 來源：源碼碼網(wǎng)
  • 編輯：源碼碼網(wǎng)
  • 時間：2025-04-19 14:08
  • 閱讀：178
聯(lián)系客服
源碼代售 源碼咨詢 素材咨詢 聯(lián)系客服
029-84538663
手機(jī)版

掃一掃進(jìn)手機(jī)版
返回頂部