网页制作：如何使文本框获得焦点时，只呈现光标闪烁而文本框四周不变化

html-css030

网页制作：如何使文本框获得焦点时，只呈现光标闪烁而文本框四周不变化,第1张

分析问题：

文本框获取焦点时，浏览器给采用默认的处理方式，为其加上高亮外边框。

解决思路：

我们可能通过，在input获取焦点时，采用css将文本框的外边框去掉。为文本框添加如下样式即可。

outline:none

样式代码：

input:focus {outline:none}

下面给出一个完成的示例代码：

<html>

<head>

<style>

form{background-color : #FF00F1Fheight:50pxpadding : 15px}

.inputStyle, .inputStyle:focus {outline:none}

</style>

</head>

<body>

<div id="dh2">

<form>

<input type="text"  class="inputStyle"/>

<input type="text" />

</form>

</div>

</body>

</html>

left:100px去掉就好了，可以用float之类的做，然后width里面加一点宽度，float:left 或者right一般就能定位了。

用类似mouseover 的也能做。类似下面这种，希望对你有启发。

<a href="#" target="_blank" title="">

    <img src="1.jpg"

         onmouseover="this.src='2.jpg'"

         onmouseout="this.src='3.jpg'">

    </img>

</a>