css样式之input输入框默认样式
帮朋友写个简单的课程设计,后面会贴出来,项目刚开始就遇到一个坑(给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输入框默认样式的更多相关文章
- Chrome中输入框默认样式移除
Chrome中输入框默认样式移除 在chrome浏览器中会默认给页面上的输入框如input.textarea等渲染浏览器自带的边框效果 IE8中效果如下: Chrome中效果如下: 这在我们未给输 ...
- css去除webkit内核的默认样式
做移动端的朋友应该知道,iphone的默认按钮是个很恶心的圆角,select下拉框也有默认样式无法修改. 这时候可以用到 -webkit-appearance:none //去除默认样 在按钮和sel ...
- 修改input输入框的样式
直接上代码 <style> .input{ -web-kit-appearance:none; -moz-appearance: none; font-size:1.4em; height ...
- html5中如何更改、去掉input type默认样式
1.如何去掉input type=date 默认样式 HTML代码: 选择日期:<input type="date" value="2017-06-01" ...
- css修改select下拉列表的默认样式
select的一些默认样式我们很难修改,比如图标的替换.接下来就说说如何修改这些默认样式: html代码: <div> <select name=""> & ...
- CSS消除button标签的默认样式
button{ /*消除button的默认样式*/ /*这种写法是对所有的button标签同时生效*/ margin: 0px; padding: 0px; /*自定义边框*/ border: 0px ...
- (谷歌浏览器等)解决css中点击input输入框时出现外边框方法【outline:medium;】
问题:在使用谷歌浏览器,360浏览器时,点击input输入框会出现带颜色的外边框,如下图所示:
- Chrome 下input的默认样式
一.去除默认边框以及padding border: none;padding:0 二.去除聚焦蓝色边框 outline: none; 三.form表单自动填充变色 1.给input设置内置阴影,至少要 ...
- 去除input的默认样式
input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...
随机推荐
- Zabbix调优不完全指南(https://www.jianshu.com/p/2d911d55448f)
从学习搭建zabbix到完成各类监控.调优.二次开发已经过去了两年,期间通过QQ学习群.zabbix官方社区.各个技术博客整理学习了不少关于各种报错的处理方法,现在将常见的一些报错处理方法整理出来分享 ...
- 基于墨刀实现的购物app
在观察研究购物app后 仔细分析总结了几个基础功能,实现如下的界面: 主界面:购物app的推荐界面,提供各式的样品,将整个app的多种功能进行展示. 推荐分类:根据用户浏览的宝贝,对用户进行合理推荐. ...
- Pandas学习笔记(三)
(1)系列对象( Series)基本功能 编号 属性或方法 描述 1 axes 返回行轴标签列表. 2 dtype 返回对象的数据类型(dtype). 3 empty 如果系列为空,则返回True. ...
- Supervisor配置
Supervisor(http://supervisord.org/)是用Python开发的一个client/server服务,是Linux/Unix系统下的一个进程管理工具,不支持Windows系统 ...
- vs2015 iis express启动不了及安装DotNetCore.1.0.0-VS2015Tools.Preview2失败的解决方法
直接用管理员账户打开cmd,进入exe所在的文件夹在运行命令DotNetCore.1.0.0-VS2015Tools.Preview2.exe SKIP_VSU_CHECK=1不要加引号. PS:如果 ...
- python request 请求https verify=False时warning
import requests from requests.packages.urllib3.exceptions import InsecureRequestWarning requests.pac ...
- sqlserver2012 数据库差异备份恢复 记录
sqlserver2012恢复过程: 先恢复全备份,再恢复差异,注意:勾选NoRecovery选项. 恢复完成后,出现: Sqlserver数据库 一直显示“正在还原…” 的状态. 引用:http:/ ...
- 嵌入式linux——点亮led灯(二)
刚才在jz2440板子上写了一个点亮中间led的程序,前前后后十几分钟才好.最终代码 本节内容: 1. 汇编点灯 2. C点灯 3. 参数选择点灯 4. 按键点灯 1. 汇编点灯 .text .glo ...
- Synchronized总结
一.synchronized加锁原理 synchronized可以保证方法或者代码块在运行时,同一时刻只有一个线程可以进入到临界区,同时它还可以保证共享变量的内存可见性. Java中每一个对象都可以作 ...
- 【活动发布】捷微H5-微信新年砍价活动,开源发布了
活动名称: 微信新年砍价 适用项目: 捷微H5活动平台源码下载:http://yun.jeecg.org/pmall/detail/924D63E4F73B4387B75DE9B8545136C5 视 ...