除掉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 ...
随机推荐
- VC获取屏幕分辨率及大小相关(转)
vc得到屏幕的当前分辨率方法: 1.Windows API调用 int width = GetSystemMetrics ( SM_CXSCREEN ); int height= GetSystem ...
- C#流水号生成汇总(四)
简单高效的ID生成方式 http://www.ikende.com/blog/6014522c24ff4ef89cfb430f9c5a8489 一个简单唯一ID生成规则 http://www.iken ...
- Selenium2+python自动化61-Chrome您使用的是不受支持的命令行标记：--ignore-certificate-errors
前言 您使用的是不受支持的命令行标记:--ignore-certificate-errors.稳定性和安全性会有所下降 selenium2启动Chrome浏览器是需要安装驱动包的,但是不同的Chrom ...
- [runtime] initialize方法讲解
+ (void)initializeDescription(描述) Initializes the class before it receives its first message. 在这个 ...
- tomcat7.0.8的高级应用-apr1.4.2安装
一 windows下安装 直接拷贝tcnative-1.dll到TOMCAT_HOME/bin目录下,启动即可 下载地址 http://archive.apache.org/dist/tomcat/t ...
- MAC之find与grep
小白,新手.有错请指出. grep一般是搜指定文件中的内容:而find是搜对应的文件 find:1. 找出当前文件目录及其子目录含有开头a的文件. “.”是当前目录 “-ls”显示详细信息fin ...
- numpy转换
csv2npy cccsv=numpy.genfromtxt('/root/c.csv', delimiter = ',') buf2npy imga=numpy.frombuffer(buf,num ...
- JAVA常见算法题(三十四)---计算加密之后的电话号码
某个公司采用公用电话传递数据,数据是四位的整数,在传递过程中是加密的, 加密规则如下: 每位数字都加上5,然后用和除以10的余数代替该数字, 再将第一位和第四位交换,第二位和第三位交换. 求加密之后的 ...
- 卡方检验(Chi-square test/Chi-Square Goodness-of-Fit Test)
什么是卡方检验 卡方检验是一种用途很广的计数资料的假设检验方法.它属于非参数检验的范畴,主要是比较两个及两个以上样本率( 构成比)以及两个分类变量的关联性分析.其根本思想就是在于比较理论频数和实际频数 ...
- 特殊汉字“𣸭”引发的对于字符集的思考；mysql字符集；sqlalchemy字符集设置；客户端字符集设置；
字符集.字符序的概念与联系 在数据的存储上,MySQL提供了不同的字符集支持.而在数据的对比操作上,则提供了不同的字符序支持. MySQL提供了不同级别的设置,包括server级.database级. ...