<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="智能社 - zhinengshe.com">
<meta name="copyright" content="智能社 - zhinengshe.com">
<title>智能社 - www.zhinengshe.com</title>
<style>
* { margin:; padding:; }
.box {position:relative; width:200px; margin:50px auto;}
.box span { position:absolute; top:; left:5px; height:40px; line-height:40px; color:#; }
#inp1,#pass{ position:absolute; top:; left:; border:1px solid #; /* border:none 0;这个是兼容的写法 */
outline:none;width:190px; height:40px; line-height:40px; padding: 5px; background:none;}
#pass{top:55px;}
input::-ms-clear { display:none; } /* 去掉IE10输入框后的叉号 */
input::-ms-reveal{ display:none;} /* 去掉输入密码时的眼睛 */
</style>
<script>
window.onload=function (){
var oInp=document.getElementById('inp1');
var oSpan=document.getElementById('span1'); oInp.onfocus=function (){
oSpan.style.display='none';
};
oInp.onblur=function (){//失去焦点判断输入为空时 if (oInp.value.length == )
{
oSpan.style.display='block';
}
};
oSpan.onclick=function (){//点击提示文字时情况
oInp.focus();
};
};
</script>
</head> <body>
<div class="box">
<input type="text" id="inp1" />
<span id="span1">我是提示文字</span>
<input type="password" id="pass"/>
</div> </body>
</html>
文章地址https://www.yii666.com/article/758048.html网址:yii666.com文章来源地址:https://www.yii666.com/article/758048.html