Heim > Web-Frontend > js-Tutorial > 在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法_javascript技巧

在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法_javascript技巧

WBOY
Freigeben: 2016-05-16 18:06:25
Original
1290 Leute haben es durchsucht

特别是input[text]和textarea,并且在textarea右下角还有一个可用鼠标拖动该表textarea大小的功能,如下图所示:

input[text]:

在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法_javascript技巧

textarea:

在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法_javascript技巧

有的时候黄色边框很影响页面效果,并且textarea拖动改变大小之后直接影响布局,所以为了不使这些多余的功能和效果影响页面,可以使用一下几句CSS清除掉chrome浏览器的默认效果,代码如下:

取消表单项聚焦时产生的黄色边框:

复制代码 代码如下:

input,button,select,textarea{outline:none}

取消textarea的拖动改变大小的功能:
复制代码 代码如下:

textarea{resize:none}

合并之后:
复制代码 代码如下:

input,button,select,textarea{ outline:none;}
textarea{ font-size:13px; resize:none;}
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage