課程
/前端開發(fā)
/HTML/CSS
/初識HTML(5)+CSS(3)-升級版
輸入密碼框內(nèi)的哪個小眼睛怎么實現(xiàn)的???
2021-04-09
源自:初識HTML(5)+CSS(3)-升級版 6-1
正在回答
input type的屬性用password就有啦
我們可以利用Font Awesome一套絕佳的圖標(biāo)字體庫和CSS框架
下面是我的代碼,你可以看一下
<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>表單標(biāo)簽</title>
????<link?>
</head>
<body>
????<form?method="post"?action="test2.html">
????????<label?for="username">用戶名:</label>
????????<input?type="text"?name="username"?id="username"?value=""?/>
????????<label?for="pass">密碼:</label>
????????<input?type="password"?name="pass"?id="pass"?value=""?/>
????????<i?class="fa?fa-eye"?onclick="showhide()"?id="eye"></i>
????????<input?type="submit"?value="確定"?name="submit"?/>
????????<input?type="reset"?value="重置"?name="reset"?/>
????</form>
</body>
<script?type="text/javascript">
var?a=document.getElementById("eye");
var?b=document.getElementById("pass");
function?showhide(){
???????if(b.type=="password"){
?????????????b.type='text';
???????????a.className='fa?fa-eye-slash'
???????}else{
???????????b.type='password';
???????????a.className='fa?fa-eye'
???????}
}
</script>
</html>
這個要結(jié)合js來控制
舉報
HTML(5)+CSS(3)基礎(chǔ)教程8小時帶領(lǐng)大家步步深入學(xué)習(xí)標(biāo)簽用法和意義
3 回答請問誰知道比如在密碼輸入框中,有一個眼睛一樣的可視按鈕是怎么寫出來的呢
3 回答怎么在密碼框中寫上“輸入密碼”
6 回答文本輸入框、密碼輸入框
5 回答文本輸入框、密碼輸入框
3 回答文本輸入框,密碼輸入框
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2023-08-25
input type的屬性用password就有啦
2021-05-06
我們可以利用Font Awesome一套絕佳的圖標(biāo)字體庫和CSS框架
下面是我的代碼,你可以看一下
<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>表單標(biāo)簽</title>
????<link?>
</head>
<body>
????<form?method="post"?action="test2.html">
????????<label?for="username">用戶名:</label>
????????<input?type="text"?name="username"?id="username"?value=""?/>
????????<label?for="pass">密碼:</label>
????????<input?type="password"?name="pass"?id="pass"?value=""?/>
????????<i?class="fa?fa-eye"?onclick="showhide()"?id="eye"></i>
????????<input?type="submit"?value="確定"?name="submit"?/>
????????<input?type="reset"?value="重置"?name="reset"?/>
????</form>
</body>
<script?type="text/javascript">
var?a=document.getElementById("eye");
var?b=document.getElementById("pass");
function?showhide(){
???????if(b.type=="password"){
?????????????b.type='text';
???????????a.className='fa?fa-eye-slash'
???????}else{
???????????b.type='password';
???????????a.className='fa?fa-eye'
???????}
}
</script>
</html>
2021-04-10
這個要結(jié)合js來控制