除掉inline-block 间距
1、现象：
<!doctype html>
<html lang="en"> <head>
<meta charset="UTF-8" />
<title>除掉inline-block 间距</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
} ul {
list-style: none;
} ul li {
display: inline-block;
width: 100px;
border: 1px solid red;
}
</style>
</head> <body>
<ul>
<li>555</li>
<li>666</li>
<li>777</li>
</ul>
</body> </html>
显示效果：
2、处理方法
父元素设置font-size: 0;
<!doctype html>
<html lang="en"> <head>
<meta charset="UTF-8" />
<title>除掉inline-block 间距</title>
<style type="text/css">
* {
padding: 0;
margin: 0;
} ul {
list-style: none;
/*关键属性设置*/
font-size: 0;
} ul li {
display: inline-block;
width: 100px;
border: 1px solid red;
font-size: 16px;
}
</style>
</head> <body>
<ul>
<li>555</li>
<li>666</li>
<li>777</li>
</ul>
</body> </html>
显示效果：
除掉inline-block 间距的更多相关文章
- inline-block,inline,block,table-cell,float
float:left ---------------------------------------------------------------------------------------- ...
- inline,block,inline-block的区别
display:block block元素会独占一行,多个block元素会各自新起一行.默认情况下,block元素宽度自动填满其父元素宽度. block元素可以设置width,height属性.块级元 ...
- 块状元素和内联元素 【inline block】
// 9) { colorRandom += colorArray[randomV - 10]; } else { colorRandom += randomV; } } currentEle.css ...
- inline, block, and inline-block
总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...
- display:inline block inline-block 的区别
原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...
- inline,block,inline-block解析
display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...
- CSS3如何去除 inline block 元素之间多出的空格
display: inline-block 属性很好的避免了元素的浮动问题,但是会有点小问题,就是 inline-block 元素间的回车会被显示为一个空格.然而,我们写代码时,都是用回车来格式化的. ...
- CSS 概念 Block Inline Containing block
Block 元素 包括 "block-level box," "block container box," and "block box" ...
- [CSS3] CSS Display Property: Block, Inline-Block, and Inline
Understanding the most common CSS display types of block, inline-block, and inline will allow you to ...
- 去除inline-block元素间间距的N种方法<转>
一.现象描述 真正意义上的inline-block水平呈现的元素间,换行显示或空格分隔的情况下会有间距,很简单的个例子: <input /> <input type="su ...
随机推荐
- QN-H618 遥控器复制再生仪(拷贝机)
针对现在市场上日益更新的遥控器种类,本公司经过长时间的研究,推出新一代拷贝机,本产品有以下特点: 1. 众多车库门遥控分析信息被集成在一台机器内,只要一种遥控器,就可以复制众多品牌的车库遥控.免去积压 ...
- SQL 脚本中的全角逗号引起【ORA-01756: 引号内的字符串没有正确结束】
今天运行壹個小程序,功能是读取指定目录下的 SQL 脚本,并加载到内存中批量执行,之前的程序运行良好.但是今天相关开发人员更新了其中壹個 SQL 脚本,于是程序运行的时候就出错了,错误提示信息如下:批 ...
- ibatis实战之中的一个对多关联
在实际开发中,我们经常遇到关联数据的情况,如User对象拥有若干Book对象 每一个Book对象描写叙述了归属于一个User信息,这样的情况下,我们应该怎样处理? 通过单独的Statement操作固然 ...
- 老生常谈ajax
一,js中的ajax ajax(Asynchronous Javascript And XML)即为异步的JavaScript和XML,顾名思义,这个技术是和我们当前页面刷新无关的,因为它是异步的,在 ...
- BMP文件格式实例分析
1. 以下为一个RGB565-16位BMP位图实际的部分数据: 00000000h: 42 4D 46 58 02 00 00 00 00 00 46 00 00 00 28 00 ; BMFX... ...
- mybatis配置文件，注意标签配置顺序。否则报错The content of element type "configuration" must match "(properties?,settings?,...怎么解决
感谢原作者http://www.cnblogs.com/zhoumingming/p/5417014.html 注意每个标签必须按照顺序写,不然就会提示错误 顺序是 <?xml version= ...
- linu下修改mysql数据库面
修改密码:1.例如你的 root用户现在没有密码,你希望的密码修改为123456,那么命令是:mysqladmin -u root password 1234562.如果你的root现在有密码了(12 ...
- firedac引擎DATASNAP多表查询和多表提交
firedac引擎DATASNAP多表查询和多表提交 属性设置FDTableAdapter1.SchemaAdapter := FDSchemaAdapter;FDTableAdapter1.DatS ...
- 【转】利用HTML5开发Android
● Android设备多分辨率的问题 Android浏览器默认预览模式浏览 会缩小页面 WebView中则会以原始大小显示 Android浏览器和WebView默认为mdpi.hdpi相当于mdpi的 ...
- java中ant包中的org.apache.tools.zip实现压缩和解压缩
其实apache中的ant包(请自行GOOGLE之ant.jar)中有一个更好的类,已经支持中文了,我们就不重复制造轮子了,拿来用吧,这里最主要的功能是实现了 可以指定多个文件 到同一个压缩包的功能 ...