消除input,button之间的间距
代码:

效果:

问题:
input,button标签之间出现了间距,这并不是我们所期望的。
解决方法:
1.在父级元素上设置属性:font-size:0px;
将input父级字体(font-size)设为0px,可以消除间隔,但是得重新设置内联元素(input)的字体大小;

2.去掉input,button标签之间的空格

3.设置input为块元素,并且给一个左浮动

效果:

原因:
input是内联块状元素(inline-block);内联元素是当做字体来处理的,字体之间是有间隔的,所以内联元素之间也是有间隔的。
消除input,button之间的间距的更多相关文章
- 两个button之间的间距如何去掉
在外层加上一个父元素,设置font-size:0;即可. 两个按钮之间的间距如何去掉
- button标签和input button
一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...
- HTML <input> <button> <submit>
定义和用法 value 属性规定与按钮关联的初始值.请始终为按钮规定 type 属性,如果不填默认值是 "submit".submit其实就是一个特殊的button. <bu ...
- HTML中button和input button的区别
button和input button的区别 一句话概括主题:<button>具有<input type="button" ... >相同的作用但是在可操控 ...
- HTML 去调table表单里面td之间的间距
首先为大家展示一下最原始的代码和效果.直接在table中用td划分的表格会默认隐藏边框. 接下来我们用css来增加样式,为table增加边框. table { border: 1px solid # ...
- 如何消除inline-block元素之间的间隙?
一.问题现象 在CSS布局中,如果我们想要将多个行内块元素并排,会发现同行显示的inline-block元素之间会出现一定的空隙,这就是换行符/空格导致的,叫做换行符/空格间隙. 1 <!DOC ...
- [Android Pro] PullToRefreshListView怎么设置各个item之间的间距
reference to : http://blog.csdn.net/qq_25943493/article/details/50923895 要设置第三方的上拉下载listView的item之间 ...
- $POST 、$HTTP_RAW_POST_DATA、php://input三者之间的区别
$POST .$HTTP_RAW_POST_DATA.php://input三者之间的区别 访问原始 POST 数据的更好方法是 php://input或者$HTTP_RAW_POST_DATA.$H ...
- 去除行内(inline/inline-block)元素之间的间距
先展示一下,行内元素之间存在间距,实例代码如下: <style> div { color: #fff; padding: 25px 50px; } .inline-f00 { displa ...
随机推荐
- Angular - - $location 和 $window
$location $location服务解析浏览器地址中的url(基于window.location)并且使url在应用程序中可用.将地址栏中的网址的变化反映到$location服务和$locati ...
- 2.11. 创建托管对象(Core Data 应用程序实践指南)
到现在为止,还没有创建过托管对象,回顾了一下,只是创建了托管对象模型,持久化存储区,持久化存储协调器,托管对象上下文. 那么,现在就来创建托管对象吧. 使用NSEntityDescription 的 ...
- BNU Online Judge-34776-What does the fox say?
题目链接 http://www.bnuoj.com/bnuoj/problem_show.php?pid=34776 题意: fox 的叫声 例如测试用例 输入 toot woof wa ow ow ...
- 响应HttpServletResponse
可以使用HttpServletResponse来对浏览器进行响应,大部分情况下,会使用setContentType()设置响应类型,使用getWriter()取得PrintWriter对象,而后使用P ...
- JSP/Servlet(一)
JSP/Servlet(一) Web应用和web.xml文件: 一.构建Web应用: 1.在任意目录下创建一个文件夹. 2.在第1步所建的文件夹内建一个WEB-INF文件夹(注意大小写). 3.进 ...
- EasyUI datagrid 删除的时候无法正确找到重复记录row index的问题
EasyUI datagrid 删除的时候无法正确找到重复记录row index的问题: 如果无法正确找到重复记录的row index,就需要进行注意添加的时候所进行的 操作:如果添加的时候就是添加的 ...
- java虚拟机启动参数整理
java启动参数 共分为三类其一是标准参数(-),所有的JVM实现都必须实现这些参数的功能,而且向后兼容:其二是非标准参数(-X),默认jvm实现这些参数的功能,但是并不保证所有jvm实现都满足,且不 ...
- 如何用webbrowser获取ajax动态生成的网页的源码?
1.步骤一:修改IE内核的版本(这个方法厉害了) public Form1() { InitializeComponent();int BrowserVer, RegVal; // get the i ...
- 第七届蓝桥杯javaB组真题解析-分小组(第四题)
题目 /* 分小组 9名运动员参加比赛,需要分3组进行预赛. 有哪些分组的方案呢? 我们标记运动员为 A,B,C,... I 下面的程序列出了所有的分组方法. 该程序的正常输出为: ABC DEF G ...
- 数据结构(Java描述)之二叉树
基础概念 二叉树(binary tree)是一棵树,其中每个结点都不能有多于两个儿子. 二叉排序树或者是一棵空树,或者是具有下列性质的二叉树: (1)若左子树不空,则左子树上所有结点的值均小于或等于它 ...