码迷,mamicode.com
首页 > 其他好文 > 详细

取消谷歌 Chrome 文本框(域)外边框高亮和缩放功能的办法

时间:2014-09-09 10:56:48      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:使用   ar   div   问题   代码   on   c   line   size   

首先一下是摘抄别的博友的,我遇到过这问题才找的,希望也能为其他的博友解决这问题。
浏览器一直以来挺喜欢用谷歌的Chrome,界面简洁,体积小,速度快。因为苹果Safari也是使用Webkit内核,因此他们有着类似的样式体现。
虽然有诸多优点,但也有好心办坏事的时候,比如对文本域、文本框的处理,首先对于文本域右下角会多出一个手动缩放尺寸的功能,然后会自动加上黄色的高亮边框显示,这种“人性化”处理,一般情况下是很不错的,但是对于前端开发来讲,有时候反而成了问题,比如你想精准控制文本框文本域的外观样式和状态,那么Webkit这些处理反而成了败笔,怎么去掉这些呢?其实挺简单:
1、黄色高亮外边框的取消
input {
outline: none;
}
textarea {
outline: none;
}
如上代码,使用CSS的outline就可以取消掉;
2、文本域缩放功能的取消
也是使用CSS,具体有两种方法
textarea {
width: 400px;
max-width: 400px;
height: 400px;
max-height: 400px;
}
上面是限定最大宽度和高度(CSS2),这也是最容易想到的方法了
texearea {
resize: none;
}
需要注意,这个方法中的resize是CSS3中的语法

取消谷歌 Chrome 文本框(域)外边框高亮和缩放功能的办法

标签:使用   ar   div   问题   代码   on   c   line   size   

原文地址:http://www.cnblogs.com/liuchenya/p/3961414.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!