如何設置文本框的顏色像谷歌

我是新來的網頁開發。如何將文本框和文本框的顏色設置爲與下圖中的Google類似？如何設置文本框的顏色像谷歌

這裏是我的代碼：

.venu{ 
 
    width: 150px; 
 
    box-sizing: border-box; 
 
    border: 2px ridge #dadada; 
 
    border-radius: 2px; 
 
    font-size: 16px; 
 
    background-color: white; 
 
    background: url(2.png) top right no-repeat; 
 
    background-position:right; 
 
    background-size: 14px; 
 
    padding: 15px 20px 20px 45%; 
 
    position:fixed; 
 
    top:51%; 
 
    bottom:60%; 
 
    left:30%; 
 
    margin: auto; 
 
}

<input type="text" class="venv">

來源

2016-09-26 Dep

所以你wan't一個圖標什麼圖標？我不確定我在你的html中理解你的問題 – RasmusGlenvig

，你指的是venv類的輸入，但是在你的css中你選擇了一個類venu。類名必須匹配。請相應地調整您的代碼 –

努力並嘗試幫助您期望您對建議做出反應的人。他們投入了時間和研究，所以這是一個尊重的問題。除此之外，在對SO進行研究時，沒有做出反應使得整個問題和答案對其他人不那麼有用。 – connexo

這裏是什麼，我想你想到一個簡單的例子。它正在建立你已有的東西。

我只是看着一個麥克風圖標，但您可以自由使用，你想

.venu { 
 
    width: 400px; 
 
    height: 40px; 
 
    box-sizing: border-box; 
 
    border: 2px ridge #dadada; 
 
    border-radius: 3px; 
 
    font-size: 16px; 
 
    padding:10px; 
 
    position: absolute; 
 
    left: 0; 
 
    right: 0; 
 
    top: 0; 
 
    bottom: 0; 
 
    margin: auto; 
 
} 
 

 
.venu:focus { 
 
    box-shadow: 1px 1px 10px 0.5px gray; 
 
    outline: none; 
 
} 
 

 
img { 
 
    width:25px; 
 
    position:fixed; 
 
    left: 360px; 
 
    right: 0; 
 
    top: 0; 
 
    bottom: 0; 
 
    margin: auto; 
 
} 
 

 
img:hover { 
 
    transform:scale(1.05); 
 
    cursor:pointer; 
 
}

<input type="text" class="venu"><img src="https://cdn2.iconfinder.com/data/icons/social-messaging-productivity-1/128/speaker-512.png">

來源

2016-09-26 09:39:47

如何設置文本框的顏色像谷歌

回答

相關問題