此文来源网络,我转载的原文里的图显示“该图片仅限百度用户内部交流使用”,我估计这篇文章是从百度空间抄过来的,该作者没保留原文地址。所以我在这里也没保留抄袭文章的地址。

chrome浏览器不管对于开发者还是一般用户都可以说是一个相当优秀的网页浏览器,但是在开发中,让人感觉很多余的一个特性就是,在表单项中的控件聚焦时总会出现一个黄色边框特别是input[text]和textarea,并且在textarea右下角还有一个可用鼠标拖动该表textarea大小的功能,如下图所示:

(此图为自己截图)

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

取消表单项聚焦时产生的黄色边框:
input,button,select,textarea{outline:none}

取消textarea的拖动改变大小的功能:

textarea{resize:none}

最后把以上两个CSS合并后如下

input,button,select,textarea{ outline:none;}
textarea{ font-size:13px; resize:none;}

 

去掉chrome浏览器中input或textarea在得到焦点时出现黄色边框的方法的更多相关文章

  1. 去掉chrome、safari input或textarea在得到焦点时出现黄色边框的方法

    1.去掉chrome.safari input或textarea在得到焦点时出现黄色边框的方法 input{ outline:0;} 2.去掉chrome.safari textarea右下角可拖动鼠 ...

  2. 去掉chrome浏览器中input获得焦点时的带颜色边框呢

    可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}

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

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

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

    最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动texta ...

  5. Chrome浏览器中使用 iframe 嵌入网页导致视频不能全屏的问题解决方法

    今天无意中测试了下在 iframe 中嵌入视频, 发现全屏按钮在 Chrome 浏览器中居然无效, 试了好几个视频网站的视频都不能全屏, 但在其他浏览器中似乎都很正常, 应该是 Chrome 60 新 ...

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

    最近在改一个bug即如标题所讲的一样,chrome浏览器下当input标签开启autocomplete的时候input的背景颜色变黄同时在input的背景图片也被覆盖了.为此百度了好久发现网上说的使用 ...

  7. 修改表单元素中placeholder属性样式、清除IE浏览器中input元素的清除图标和眼睛图标

    一.修改input元素placeholder属性样式 在做项目的时候,一般表单元素的placeholder属性样式都是使用浏览器默认的,但有时候为了追求设计上的美感需要修表单元素的placeholde ...

  8. [转]chrome浏览器中 F12 功能的简单介绍

    本文转自:https://www.cnblogs.com/zhuzhubaoya/p/9758648.html chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己 ...

  9. 【F12】chrome浏览器中 F12 功能的简单介绍

    chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己也在不断摸索中,查看一些博客和资料后,自己总结了一下来帮助自己理解和记忆,也希望能帮到有需要的小伙伴,嘿嘿! 首 ...

随机推荐

  1. C++设计模式之解释器模式

    2013年07月06日 19:43:00 阅读数:8853 概述: 未来机器智能化已然成为趋势,现在手机都能听懂英语和普通话,那我大中华几万种方言的被智能化也许也是趋势,我们的方言虽然和普通话相似,但 ...

  2. iOS开发多线程篇—GCD简介

    iOS开发多线程篇—GCD介绍 一.简单介绍 1.什么是GCD? 全称是Grand Central Dispatch,可译为“牛逼的中枢调度器” 纯C语言,提供了非常多强大的函数 2.GCD的优势 G ...

  3. Ubuntu:火狐浏览器加速下载(Flashgot+Aria2+Uget)

    火狐浏览器加速下载 应用到的程序 Aria2 Uget firefox插件Flashgot 1.下载Uget sudo apt-get install uget 2. 下载Aria2 sudo apt ...

  4. secureCRT 字体颜色、文件夹和文件显示的颜色

    secureCRT菜单栏中选择会话选项 修改显示文件夹和文件显示的颜色 修改字体样式 查看效果

  5. Python 字符串的相关操作

    s = "abcdefg" s1 = s.capitalize() # 把首字母变成大写, 返回给你一个新的字符串 print(s) print(s1) s = "ale ...

  6. Nexus私服的安装与配置

    Nexus的安装与配置 仅以此文,献给陷入懒癌晚期的小伙伴们. 本文基于nexus 3.xx .0. What?Why?When?Who?Where? Sonatype Nexus是一款maven仓库 ...

  7. Objective-C和Swift混合编程开发

    创建混编的Framework工程 第一步:创建target为Framework的工程 打开Xcode6-Beta,菜单栏File—>New—>Project; 创建一个新的工程,工程模板选 ...

  8. 【计算机视觉】如何使用于仕琪老师的libfacedetect人脸检测库

    前言 最近又开始进行人脸检测方向的内容,看到于仕琪老师的多角度检测想试一下,还不清楚原理,先测试效果如何. libfacedetect人脸检测库是深圳大学于仕琪老师发布的开源库,与opencv自带的人 ...

  9. [LeetCode&Python] Problem 496. Next Greater Element I

    You are given two arrays (without duplicates) nums1 and nums2 where nums1’s elements are subset of n ...

  10. 51Nod:1134 最长递增子序列

    动态规划 修改隐藏话题 1134 最长递增子序列  基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题  收藏  关注 给出长度为N的数组,找出这个数组的最长递增子序列.(递 ...