给input元素添加float. 去除IE6 下input的空隙

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             .box{
 8                 width: 200px;
 9                 border: 1px solid #000000;
10                 background-color: red;
11             }
12             .box input{
13                 border: 0;
14                 margin: 0;
15                 width: 200px;
16                 height: 30px;
17                 background-color: #fff;
18                 *float: left;
19             }
20         </style>
21         <!--
22             解决方案：
23                 给input元素添加float
24         -->
25     </head>
26     <body>
27         <div class="box">
28             <input type="text" />
29         </div>
30     </body>
31 </html>

时间： 2024-08-06 12:27:10

给input元素添加float. 去除IE6 下input的空隙的相关文章

IE6下 input 背景图滚动问题

ie6 背景图滚动问题: <title>ie6下input背景图滚动问题</title> <style> .box{ height:20px; width:300px; background:url(%E7%BB%83%E4%B9%A0%E8%A1%A8%E6%A0%BC/mon.jpg) no-repeat; background-color:#fcf; border:1px solid #069; } .box input{height:20px; width:30

浮动元素的兼容以及ie6下li标签的部分兼容性问题

清除浮动的方法有许多比较常用的是 .clear{zoom: 1;} .clear:after{content: "";display: block;clear: both;} after伪类元素末尾添加内容Ie6,7不兼容可以用zoom来解决(zoom缩放会触发ie下的haslayout使元素根据自身内容计算宽高但火狐不支持但可以通过after伪类解决) 两者结合解决的浏览器不兼容的问题: ie6下li标签的部分兼容性问题: 可以通过给li标签加 vertical-align: top

取消chrome浏览器下input和textarea的默认样式；html5默认input内容清除“×”按钮去除办法

取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: input::-ms-clear { display: none; }

为什么 input 元素能用 width 属性

前几天在是写网页的时候发现input可以设置宽高,很疑惑,上网查了之后发现: 简单的认为 input 就是 inline 元素是片面的.元素默认以何种 display 属性值显示出来,这个其实更多的时候是由浏览器决定的(不同浏览器的差异性,导致我们需要 reset CSS),下面是部分浏览器 input 元素默认 CSS: IE6.IE7.IE8.IE9(部分) background-color: #FFF; border-width: 2px; font-family: sans-serif;

HTML5-定制input元素

下述内容主要讲述了<HTML5权威指南>第13章关于"定制input元素". input元素可以生成一个供用户输入数据的简单文本框.其缺点在于用户在其中输入什么值都可以,可以配置type类型来获取额外的属性.其中type属性有23个不同的值,而input元素共有30个属性,其中许多属性只能与特定的type属性值搭配使用. 一.用input元素输入文字 type属性设置为text的input元素在浏览器中显示为一个单行文本框. 1. 设定元素大小 maxlength属性设定用

兼容性—IE6/7/8下input空隙问题

代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> .box{ width: 300px; border:1px solid black; background: red; } input{ width: 200px; height:

Html-IOS下input的样式添加不上的解决方案

问题描述: 1 <!DOCTYPE html> 2 3 <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <meta charset="utf-8" /> 6 <title></title> 7 <style> 8 input { width: 100px; height: 25px;

为Input输入框添加圆角并去除阴影去除获得焦点时方角样式

目录 1.为Input输入框添加圆角并去除阴影 2.去除获得焦点时方角样式内容 1.为Input输入框添加圆角并去除阴影 1.1 border-radius不同浏览器下兼容设置: .boder-radius{ -webkit-border-radius:6px;//适配以webkit为核心的浏览器(chrome.safari等) -moz-border-radius:6px;//适配firefox浏览器 -ms-border-radius:6px;//适配IE浏览器 -o-border-rad

IE6 下关于Position：absolute;属性对同级元素的影响问题

今天小码哥做一个专题页面的时候,碰到一个关于IE6下position:absolute:属性对同级元素的margin属性有影响的问题.虽然,作为前端人员,IE6下的Bug问题,始终让人头疼不已.但生活在Zhong国的码民们只能继续忍受. 言归正传,是什么问题呢? 即:假如在一个设有position:relative:相对定位属性的div盒子里,同时放另外两个div块级元素layer2,layer3.layer2设有position:absolute:属性,layer3设有margin:30px