取消chrome下input和textarea的聚焦边框

取消chrome下input和textarea的聚焦边框

2011-12-13 15:48:42|  分类: css兼容问题|举报|字号 订阅

取消chrome下input和textarea的聚焦边框:

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

取消chrome下textarea可拖动放大:

textarea{resize:none}

最后,写在一起,重置input和textarea的默认样式:

input,button,select,textarea{outline:none} textarea{resize:none}
时间: 2024-10-03 21:41:53

取消chrome下input和textarea的聚焦边框的相关文章

取消chrome浏览器下input和textarea的默认样式

最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动textarea还会使页面布局错乱,所以决定重置这些样式. 看代码: 取消chrome下input和textarea的聚焦边框: input,button,select,textarea{outline:none} 取消chrome下textarea可拖动放大: textarea{resize:none} 最

取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法

取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: input::-ms-clear { display: none; }

关于chrome下input中Enter的keydown事件会自动提交form的疑问与解决

当页面有<form>操作时,浏览器会有默认的响应enter键就提交form表单. 看html代码 <form action="http://www.7k7k.com"> <input type="text"> 当你在input框里输入后,按enter键,就会默认提交form, 但实际需求并不是这样的,比如在input输入时会有弹出的suggestion选项让用户选择,用户按了enter键后并不想直接提交,所以需要在部分逻辑下需要取

清除IOS下input及textarea的阴影

在IOS下,input表单以及textarea默认会有个内阴影,一定程度上影响视觉一致,可通过设置下面代码去掉: input,textarea{     -webkit-appearance: none; }

去掉谷歌浏览器获取焦点时默认的input、textarea的边框和背景

本文主要核心内容为:去掉chrome(谷歌)浏览器默认的input.textarea的边框(border)和背景(background) 及chrome下不可更改textarea大小,感兴趣的朋友可以了解下 去掉chrome(谷歌)浏览器默认的input.textarea的边框(border)和背景(background) 及chrome下不可更改textarea大小 1.使用Chrome的都知道,当鼠标焦点在input.textarea这些元素上时,Chrome默认的会给它们加上黄色的边框,我

chrome、safari中的input或textarea

1.去掉chrome.safari input或textarea在得到焦点时出现黄色边框的方法 input{ outline:0;} 2.去掉chrome.safari textarea右下角可拖动鼠标改变textarea大小的方法 textarea{ resize:none;} 集合: input,textarea{ outline:0; resize:none;} 3.input中文字垂直居中 input{ margin:0; padding:0;} .login input{ height

关于textarea在safari chrome下可拖动大小的问题

解决方法:     resize: none; 或者:     max-width:300px;     max-height:300px;     width:300px;     height:300px; 关于textarea在safari chrome下可拖动大小的问题,布布扣,bubuko.com

chrome下float元素下input选中内容bug

今天在写一个小demo的时候,发现chrome下一个很奇怪的bug. 我的代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>chrome下float bug</title> <style> .clearfix{*zoom:1;} .clearfix:after{content:&qu

input 光标在 chrome下不兼容 解决方案

input 光标在 chrome下不兼容 解决方案 height: 52px; line-height: normal; line-height:52px\9 .list li input[type=text] { width: 304px; height: 52px; line-height: normal; line-height: 52px\9; border: none; color: #FFFFFF; background: url(../images/txt-bg.png) no-r