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.建议不这样子使用,原因主要是性 ...
随机推荐
- [Abp vNext 源码分析] - 6. DDD 的应用层支持 (应用服务)
一.简要介绍 ABP vNext 针对于应用服务层,为我们单独设计了一个模块进行实现,即 Volo.Abp.Ddd.Application 模块. PS:最近博主也是在恶补 DDD 相关的知识,这里推 ...
- File文件类
目录 File文件类 File类的构造方法 File类的创建功能 File类的重命名 File类的删除功能 File类的判断功能 File类的获取功能 文件名称过滤器 File文件类 File:文件和 ...
- Java网络和代理
Java网络和代理 1)简介 在当今的网络环境中,特别是企业网络环境中,应用程序开发人员必须像系统管理员一样频繁地处理代理.在某些情况下,应用程序应该使用系统默认设置,在其他情况下,我们希望能够非常严 ...
- Jquery 小结
1. 名词解释 实例对象:var p1=new Person(); p1就是实例对象 构造:function Person(){} 原型对象:在 JavaScript 中,每当定义一个对象(函数也是 ...
- solr配置分词器
一.solr4.10 + mmseg4j-2.2.0分词器 1.solr的安装部署:http://www.cnblogs.com/honger/p/5876289.html,注意不同的版本安装方式可能 ...
- 第四章-使用本机文件对话框和帮助进程间沟通 | Electron实战
本章主要内容: 使用Electron的dialog模块实现一个本机打开文件对话框 促进主进程和渲染器进程之间的通信 将功能从主进程暴露给渲染器进程 使用Electron的remote模块从主进程导入功 ...
- 【Java】You have an error in your SQL syntax ...
详情如下: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server v ...
- 【iOS】Ineligible Devices || “无法下载应用程序”
今天遇到了这个问题,Xcode 显示如图所示: 还有真机测试无法安装的问题,如图: 究其原因,都是 版本不匹配 的问题!在 Xcode 中的 PROJECT 和 TARGETS 设置下版本就行了,如下 ...
- 又一个轮子--QMapper
1 前言 我喜欢造轮子,一是造的时候就是深刻学习的时候,二是造着造着,说不定某天比世面上的其它轮子都要好呢.比如造过Networksocket,也造过WebApiClient,现在我也要造一个Mapp ...
- codeforces 318 A.Even Odds B.Sereja and Array
A.Even Odds 给你n和k, 把从1到n先排奇数后排偶数排成一个新的序列,输出第k个位置的数. 比如 10 3 拍好后就是 1 3 5 7 9 2 4 6 8 10 第3个数是5. // ...