关于去除表单选中时的蓝色边框和设置内置提示字体

来源:互联网 发布:软件版权声明 编辑:程序博客网 时间:2024/05/16 18:56

表单我们经常用到,有时候我们想自己设置表单的边框样式,但是当我们选中边框时,表单就会显示默认的蓝色外围边框,就像下图:
这里写图片描述
其实只要加一句:outline: 0;就可以解决这个问题了。
在表单中经常会有提示性的文字,当我们鼠标放上去文字又消失了,这种也可以用JS的onfocus事件和onblur事件来处理,但是这未免太麻烦了些,placeholder是html5新增的input的一个属性,主要是让表单体验更加智能,相当于value属性,但是他有一个好处就是当我们聚焦输入文本的时候我们在placeholder=”默认值”的文本就会自动清空。不过兼容性还不太好,至少ie好像要9以上才能支持。
那如果又要改变placeholder的颜色怎么办用css就可以,不过要考虑需要针对每个浏览器做单独的设定(可以在冒号前面写input和textarea)。

 ::-webkit-input-placeholder { /* WebKit browsers */  color:#999;  }  :-moz-placeholder { /* Mozilla Firefox 4 to 18 */  color:#999;  }  ::-moz-placeholder { /* Mozilla Firefox 19+ */  color:#999;  }  :-ms-input-placeholder { /* Internet Explorer 10+ */  color:#999;  }
                                            感谢阅读

0 0