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

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

看代码:

取消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}

ok,问题解决,好像safari下也是有这些默认样式的,加这个也能同样取消

时间: 2024-10-22 08:45:19

取消chrome浏览器下input和textarea的默认样式的相关文章

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

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

一个解决chrome浏览器下input标签当autocomplete的时候背景变黄色同时input背景图片消失方案

最近在改一个bug即如标题所讲的一样,chrome浏览器下当input标签开启autocomplete的时候input的背景颜色变黄同时在input的背景图片也被覆盖了.为此百度了好久发现网上说的使用js来append操作,亲测了都不管用.除非把autocomplete=“off”关了,但这就不符合需求了 如图 网上说的改变-webkit-autofill的阴影背景是可以去除黄色背景的,但是图片依旧被覆盖了. input:-webkit-autofill{ box-shadow:0 0 0px

textarea 去除默认样式

取消chrome浏览器下input和textarea的默认样式 from:大前端 看代码: 取消chrome下input和textarea的聚焦边框: input,button,select,textarea{outline:none} 取消chrome下textarea可拖动放大: textarea{resize:none} 最后,写在一起,重置input和textarea的默认样式: input,button,select,textarea{outline:none} textarea{re

取消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

<select>在chrome浏览器下背景透明问题

在上篇文章<只用CSS美化选择框>运用了背景透明的技巧来美化选择框,但在chrome浏览器下遇到了跟ie.ff不一样的透明效果,下面重现一下: 在一个大的div(背景红色)内放置一个select元素(背景透明).在线查看(可在不同浏览器中查看效果) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt

chrome浏览器下页面顶部出现一条空白解决

最近遇到页面在chrome浏览器下,顶部会出现一条空白的问题.后来知道是bom头的问题. 1.什么是bom头? BOM签名的意思就是告诉编辑器当前文件采用何种编码,方便编辑器识别,但是BOM虽然在编辑器中不显示,但是会产生输出,就像多了一个空行. 一般的编码集中并不会出现bom头,unicode编码集中会出现. 类似WINDOWS自带的记事本等软件,在保存一个以UTF-8编码的文件时,会在文件开始的地方插入三个不可见的字符(0xEF 0xBB 0xBF,即BOM).它是一串隐藏的字符,用于让记事

前端开发入门到实战:css实现修改浏览器自动填充表单的默认样式

当表单中存在input[password]的时候,采用submit方式提交.就会触发浏览器自动填充表单.比如chrome自动填充后,淡×××输入框代替了背景样式,看起来有些怪异. ?那么如何通过css实现取消浏览器自动填充表单的默认样式呢? 解决方法一: 当input文本框是纯色背景的,可以对input:-webkit-autofill使用足够大的纯色内阴影来覆盖input输入框的×××背景:如: input:-webkit-autofill { -webkit-box-shadow: 0 0

web前端入门到实战:css实现修改浏览器自动填充表单的默认样式

当表单中存在input[password]的时候,采用submit方式提交.就会触发浏览器自动填充表单.比如chrome自动填充后,淡慌色输入框代替了背景样式,看起来有些怪异. 那么如何通过css实现取消浏览器自动填充表单的默认样式呢? 解决方法一: 当input文本框是纯色背景的,可以对input:-webkit-autofill使用足够大的纯色内阴影来覆盖input输入框的慌色背景:如: web前端开发学习Q-q-u-n: 767273102 ,分享学习的方法和需要注意的小细节,不停更新最新

&lt;input type=&#39;file&#39;/&gt;把默认样式改成框框

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"><head><meta http