帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给input输入框设定样式,但是,点击后会出现蓝色边框),之前写其他的项目时也遇到过,百度一下资料解决了,现在又碰到了,写一下,留着备用(代码和效果图就就不粘出来了)。

查资料后才知道html的许多标签都有一些默认的属性,这次遇到的是input标签的默认属性(点击输入框时会出现 "蓝色边框" )。话不多说,解决方法如下:

一、直接给input标签加一个online:none的样式

<style>
input {
outline:none;
}
</style>

二、直接控制input标签聚焦是不出现默认边框(原文链接:https://blog.csdn.net/yike_dc/article/details/76928479)

<style>
input:focus{ outline:none; }
</style>

css样式之input输入框默认样式的更多相关文章

  1. Chrome中输入框默认样式移除

    Chrome中输入框默认样式移除 在chrome浏览器中会默认给页面上的输入框如input.textarea等渲染浏览器自带的边框效果 IE8中效果如下: Chrome中效果如下:   这在我们未给输 ...

  2. css去除webkit内核的默认样式

    做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改. 这时候可以用到 -webkit-appearance:none //去除默认样 在按钮和sel ...

  3. 修改input输入框的样式

    直接上代码 <style> .input{ -web-kit-appearance:none; -moz-appearance: none; font-size:1.4em; height ...

  4. html5中如何更改、去掉input type默认样式

    1.如何去掉input type=date 默认样式 HTML代码: 选择日期:<input type="date" value="2017-06-01" ...

  5. css修改select下拉列表的默认样式

    select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...

  6. CSS消除button标签的默认样式

    button{ /*消除button的默认样式*/ /*这种写法是对所有的button标签同时生效*/ margin: 0px; padding: 0px; /*自定义边框*/ border: 0px ...

  7. (谷歌浏览器等)解决css中点击input输入框时出现外边框方法【outline:medium;】

    问题:在使用谷歌浏览器,360浏览器时,点击input输入框会出现带颜色的外边框,如下图所示:

  8. Chrome 下input的默认样式

    一.去除默认边框以及padding border: none;padding:0 二.去除聚焦蓝色边框 outline: none; 三.form表单自动填充变色 1.给input设置内置阴影,至少要 ...

  9. 去除input的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

随机推荐

  1. Centos 7 虚拟机挂载U盘

    本文记录环境为在Windows 7环境下,通过VMware安装Centos 7.2.挂载U盘过程如下,供日后查看,也供各位读者遇到类似问题时参考. 挂载过程及问题排除如下: 1.因为是虚拟机,所以先到 ...

  2. 深度学习(一)——CNN算法流程

    深度学习(一)——CNN(卷积神经网络)算法流程 参考:http://dataunion.org/11692.html 0 引言 20世纪60年代,Hubel和Wiesel在研究猫脑皮层中用于局部敏感 ...

  3. 升级openssl 操作记录

    openssl 是一群黑客最爱研究搞怪的一个软件为啥,据说openssl是一群数学家编写的一套算法 哈哈 好,说正事 openssl 经常发布补丁包,因为升级是避免不了的 步骤: 查看当前openss ...

  4. JavaWeb——关于RequestDispatcher的原理

    RequestDispatcher简介 RequestDispatcher 代表请求的派发者.它有2个动作:forward 和 include .客户端对于任何一个请求,可以根据业务逻辑需要,选择不同 ...

  5. 关于使用echarts走过的坑(同grid多图、多轴系列)

    相信大家在工作中,经常会用到echarts,今天我说下我在工作中浪费时间较长的坑 先来看看我的终极需要实现的图吧: 相信以上效果对于常用的小伙伴来说并不困难, 在此我只说option的配置,关于数据, ...

  6. 根据URL地址获取对应的HTML,根据对应的URL下载图片

    核心代码(获取HTML): #region 根据URL地址获取信息GET public static String GetResult(string url) { return GetResult(u ...

  7. C# 面试知识点网络文档整理

    一 C# .NET技术 1.ASP.NET MVC如何控制权限? 2.C#.NET中的CTS.CLS和CLR? 3.什么是多线程,如何创建和如何使用?请写一个多线程单例模式? 4.什么是单例模式? 5 ...

  8. 几种解决方法:idea 找不到符号或找不到包

    一. idea找不到符号,可能是因为编码问题,所以,在File->settings->Editor->File Encodings-找到编码设置,更改为项目的编码要求,一般都为utf ...

  9. ReactiveX 学习笔记(25)使用 RxJS + Vue.js 调用 REST API

    JSON : Placeholder JSON : Placeholder (https://jsonplaceholder.typicode.com/) 是一个用于测试的 REST API 网站. ...

  10. java swing button和键盘监听冲突问题

    原因: 点击button会让jframe失去焦点,然后键盘监听不起作用 解决: 让jframe重新获取焦点就行了 jf.setFocusable(true); // JFrame jf = new J ...