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

abcd232110个月前前端开发347

chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动textarea还会使页面布局错乱,所以决定重置这些样式。这是大前端调整的样式,样式统一就是好看,o(∩_∩)o 哈哈····

取消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下也是有这些默认样式的,加这个也能同样取消。

相关文章

JQ获取浏览器宽度,根据不同宽度给div赋值

var winWidth = $(window).width();     var winHeight =$...

滚动条触动css动画效果——WOW.js

在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感。WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件,很容易定制,你可以改变动画设置喜欢的风格、延迟、长度、...

CSS字体font-family的正确选择方案

本文主要介绍的是CSS字体font-family的正确选择方案,由于设计稿和平台的不同,导致了制作有时候无法还原设计稿,理清各种平台字体区别,有助于做出最好的选择。大家都知道,在不同操作系统、不同游览...

3种方法实现CSS隐藏滚动条并可以滚动内容

隐藏滚动条的同时还需要支持滚动,我们经常在前端开发中遇到这种情况,最容易想到的是加一个iscroll插件,但其实现在CSS也可以实现这个功能,我已经在很多地方使用了,下面一起看看这三种方法。方法1:计...

jQuery.raty.js星星评分插件使用

jQuery.raty.js星星评分插件使用

在做前端开发的过程中,我们经常用到星星评分插件。这里推荐一jquery,raty.js是一个专门用来做评分的。星星显示的效果如下:<script src="js/jquery...

a标签的为空链接和返回上一页的设置方法

a标签中的href值是一个地址,指示点击这个标签时,转向的地址。但是当使用a标签来做按钮,不需要跳转时,href值即为空。 我们需要使用以下两种方式:...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。