css相关,鼠标点击<input>输入域后出现有颜色的边框,如果使用css,将这个鼠标点击输入域后产生的边框去掉呢?下面是截图
鼠标未点击前:
鼠标点击后:
根据大家的办法实现不了的,即使可以改变颜色,但是那条有颜色的线还是无法消除。下面是我的html和css代码:
html:
<input type="text" name="content" id="input_box">
css:
#input_box{
border-width:0;
border-color:white;
border-style:none;
background:none;
}
#input_box:focus{
border:0;
}
用:focus伪类就可以实现
input:focus {如上,可以根据自己的具体需求更改颜色、像素
要想美观的话,可以根据设计风格,添加border-radius属性来增加边角圆角效果
追问还是实现不了,我把我的代码贴上来了,帮忙看下吧
追答你是要去掉focus的效果啊。。。
那简单了。。
input:focus {按照你的指导已经实现了,谢谢啊,但是我还有个问题,就是开始时光标是占满整个输入域的宽度的,但是我在输入域中写入内容后,光标的底部就与输入域的底部有间隙了,这该如何使用css调整呢,使光标永远在输入域的中间,而不是偏向上方呢?下面是截图:
这跟字号、字体,浏览器渲染引擎、系统字体渲染方式等因素共同影响的
有可能你这里看有问题,但是在别人那不一定有,所以很难处理
如果非要试试,调整input内字体的大小、行高、padding之类的试试吧
恩,那我试试,谢谢了啊O(∩_∩)O
我已经把代码贴上来了,帮忙看下吧,谢谢啊
追答你是在哪种浏览器中看到这个框的?