input样式重置(outline:none)
我们在写表单的时候,经常需要自定义表单的样式,当然input输入框也不例外,那么如何能写出好看一点的输入框呢?
例如简单的三个空按钮:
<input type="button" id="btn1">
<input type="button" id="btn2">
<input type="button" id="btn3">
来个简单的样式:
width: 50px;
height: 50px;
border-radius:50%;
运行如下图显示的(各个浏览器之间默认样式有所差距):

所以,首先要将input输入框的默认样式去掉(让其在任何地方显示的一样):
border:0;
outline:none;
再看效果:
;
这样就ok啦;
input样式重置(outline:none)的更多相关文章
- css修改input表单默认样式重置与自定义大全
链接地址: 伪元素表单控件默认样式重置与自定义大全 http://www.zhangxinxu.com/wordpress/?p=3381 Chrome 现在不支持通过伪元素修改 meter 元素样式 ...
- css扁平化博客学习总结(二)css样式重置
css样式重置 方法一:不推荐使用,这么写会让网页解析速度变慢. *{ margin: 0; padding: 0;} 方法二:大家常用的写法,比较流行. body, html, div, block ...
- 分享一下自己在用的CSS样式重置代码
通过借鉴网上大牛们的经验和自己在工作中碰到的一些问题,总结出了这些比较常用的CSS样式重置的代码: @charset "utf-8"; /* 防止用户自定义背景颜色对网页的影响,添 ...
- 常见网站CSS样式重置
腾讯 1 2 3 4 5 6 7 8 9 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fieldset,legend,input,textarea, ...
- 非常好用的CSS样式重置表
非常好用的CSS样式重置表 我们在项目前期准备时都会准备好一个reset.css,因为不同浏览器对标签的解析各不相同,重置css样式可以让标签在不同浏览器下产生相同的效果.所以一个 ...
- [CSS] input样式定制
input样式 定制一个泥团input,想怎么捏就怎么捏 appearance: none 所有主流浏览器都不支持 appearance 属性. Firefox 支持替代的 -moz-appearan ...
- ios下表单disabled样式重置
在做最近的一个活动项目时,需要用到表单的disabled状态,但是在IOS下那颜色不是一般的浅,就跟没有一样,一开始通过如下样式重置: input:disabled, input[disabled]{ ...
- css样式重置 移动端适配
css 默认样式重置 @charset "utf-8"; *{margin:0;padding:0;} img {border:none; display:block;} em, ...
- css样式重置,不建议用通配符
由于各个浏览器对css样式的默认样式不一致,所以有必要进行样式重置.在网上看到很多建议使用 *{margin:0;padding:0} 重置margin和padding.建议不这样子使用,原因主要是性 ...
随机推荐
- UVA12657 Boxes in a Line:题解
题目链接:https://www.luogu.org/problemnew/show/UVA12657 分析: 此题使用手写链表+模拟即可.(其实可以用list,而且更简便,但是会大大的超时) 肯定是 ...
- MySql的数据库优化到底优啥了都??(1)
嘟嘟最不愿意做的就是翻招聘信息. 因为一翻招聘信息,工作经历你写低于两年都不好意思,前后端必须炉火纯青融汇贯通,各式框架必须如数家珍不写精通咋的你也得熟练熟练, 对了你是985吗?你是211吗??你不 ...
- 回顾二分与bfs(或者说是递推)和简单模拟
今天,阳光正好,适合敲代码,诸事皆宜. 先来两道简单的模拟题. 第一道 机器翻译 输出为5. 代码思路:很明显需要用到队列来存单词,在建立一个bool数组来存储队列中有没有这个单词,需不需要向外界查询 ...
- Servlet高级应用
会话只是指一段指定的时间间隔. 会话跟踪是维护用户状态(数据)的一种方式.它也被称为servlet中的会话管理. Http协议是一个无状态的,所以我们需要使用会话跟踪技术来维护用户状态. 每次用户请求 ...
- 模拟器无Back、Menu等键
问题如图所示: 解决方法: 1. 打开Android Virtual Device (AVD) Manager --> 选择模拟器,并点击edit --> 勾选KeyBoard中的选项,并 ...
- go 学习之路(二)
一.文件名 关键字 标识符 所有go源码都以.go结尾 标识符以字母或下划线开头,大小写敏感 a.boy b.Boy c.a+b d.0boy e._boy f.=_boy g._ 以上变量c.d.f ...
- Thread.Sleep太久,界面卡死
在Winform程序的UI界面使用Thread.Sleep,窗体界面会被卡死,如图1所示,程序sleep 5000毫秒,时间到了之后,按钮的名称才更改过来,窗体也能被鼠标拖动.而用Delay方法,就能 ...
- RocketMQ中Broker的HA策略源码分析
Broker的HA策略分为两部分①同步元数据②同步消息数据 同步元数据 在Slave启动时,会启动一个定时任务用来从master同步元数据 if (role == BrokerRole.SLAVE) ...
- IE浏览器主页被篡改为2345,针对一般解决办法无法解决的情况
1.注册表修改 按微软键+R 输入regedit 弹出注册表.HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\MAIN 将右侧的Sta ...
- 10.Go-goroutine,waitgroup,互斥锁和channel
10.1.goroutine goroutine的使用 //Learn_Go/main.go package main import ( "fmt" "time" ...