input , textarea 边框问题
一、去掉边框:
看看基本的HTML:
代码如下:
<input type="text" class="input_txt">
<input type="submit" value="submit" class="input_btn">
<input type="button" value="提交" class="input_btn">
<div>
通常解决这样的bug最好的方法就是在button和input的标签外添加一个标签,然后将样式写在这个标签上,并且把button和input的默认样式都去除掉。
实现方式一:设置CSS:
代码如下:
input{margin:0;padding:0;}
.wrap{background-color:#0f0;}
.input_txt,.input_btn{border:0 none;}
</style>
实现方式二:设置CSS,并使用滤镜:
代码如下:
<style type="text/css">
input{margin:0;padding:0;filter:chroma(color=#000000);border:none; }
.wrap{background-color:#0f0;}
</style>
<![endif]-->
此种方式貌似会有点问题!待在真实IE7环境中验证。
二、去掉焦点线:
代码如下:
a:focus, *:focus {noFocusLine: expression(this.onFocus=this.blur());}
</style>
input , textarea 边框问题的更多相关文章
- 去掉移动端页面 input, textarea, button, a 标签获取焦点时显示的黑影
input, textarea, button, a{ -webkit-tap-highlight-color:rgba(0,0,0,0); }
- 设置输入域(input/textarea)中文本光标的位置
以前记录了一篇 将光标定位于输入框最右侧的实现方式 ,实现光标定位在文本的最末.这种需求往往在修改现有的文本.有时可能还需要把光标定位在首位,或者中间某个位置,这就需要实现一个更通用的方法. 这个方法 ...
- 关于input/textarea提交内容空格回车转换问题,以及ng-model去除空格问题
input/textarea提交内容空格回车转换问题 /*my-enter-bind.js*/ /*回车换行显示转义*/ 'use strict'; angular.module('app') .di ...
- JavaScript为input/textarea自定义hover,focus效果
<title>JavaScript为input/textarea自定义hover,focus效果</title> <script type="text/java ...
- html的input输入框边框
1.输入框边框完全隐藏<input type="text" style="outline:none;border:0" /> 2.input去边框立 ...
- 【前端JS】input textarea 默认文字,点击消失
如题.前端页面的 input textarea 有时候须要显示默认文字以提示用户,下面为实现代码,以 input 为例.textarea 能够直接搬用 HTML <input type=&quo ...
- label 和input/textarea居中对齐
设置label和input/textarea的vertical-align: middle;即可实现垂直方向居中对齐.有时候可能会有偏差,设置input的margin-top使看上去居中对齐
- 转 移动端-webkit-user-select:none导致input/textarea输入框无法输入
移动端webview中写页面的时候发现个别Android机型会导致input.textareat输入框无法输入(键盘可以弹起,不是webView.requestFocus(View.FOCUS_DOW ...
- 移动端-webkit-user-select:none导致input/textarea输入框无法输入
这个问题,也算是个大坑了. 最开始的开始,是因为我们在做大装盘活动的时候,发现在ios上面出现了这样的问题:点击“转”按钮,ios上面会有延迟并且会出现图片的阴影,这个肯定就不好看了撒,然后,找吧,改 ...
随机推荐
- 覆盖的面积(HDU 1255 线段树)
覆盖的面积 Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Problem D ...
- spring netty-socket.io
spring-nettysocketio.xml文件内容如下: <?xml version="1.0" encoding="UTF-8"?>< ...
- IE6兼容性问题及IE6常见bug详细汇总
转载地址:http://www.jb51.net/css/76894.html 1.IE6怪异解析之padding与border算入宽高 原因:未加文档声明造成非盒模型解析 解决方法:加入文档声明&l ...
- Tortoise 下修改服务器路径(Relocate与Switch)
今天遇到SVN的路径变化,要在客户端修改服务器的下载路径,当初想直接删除重新checkout,后来想着还要重建项目比较麻烦,就找找修改服务器路径的方法.网上基本说的都是右键-->Relocate ...
- table插件实现
选择.取消.全选.全部取消.获取行ids /** * Created by lizongqiong on 2016/1/8. */ var $ = require('jquery'); var tab ...
- Appium自动化测试1 - 安装部署
主要参考文章“虫师”自动化部署教程,不过结合自己的一些情况记录此博客~ 1.准备安装包 1)jdk; 下载及安装过程省略,我下载的是jdk1.7版本. 2) adt&SDK; SDK下载的是e ...
- 匿名函数和Lamda
不是本人所写!网络收集 C#中的匿名函数和Lamda是很有意思的东东,那么我们就来介绍一下,这到底是什么玩意,有什么用途了? 打开visual studio 新建一个控制台程序. 我们利用委托来写一个 ...
- FROM_UNIXTIME()和UNIX_TIMESTAMP()函数的区别
Unix时间戳(Unix timestamp),是一种时间表示方式,定义为从格林威治时间1970年01月01日00时00分00秒起至现在的总秒数. 在MySQL中如何格式化时间戳?在mysql中因为t ...
- MultiDex到底有多坑
google为什么要引入MultiDex? dex指令是用16位寄存器来保存dex中的方法数,所以限制了在apk 中最大的方法数为65535,当超过这个最大值在编译的时候会报 方法数超标的错误. 如何 ...
- 【转】关于 Web GIS
以下部分选自2015-03-01出版的<Web GIS从基础到开发实践(基于ArcGIS API for JavaScript)>一书中的前言部分: Web GIS 概念于1994 年首次 ...