除掉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 ...
随机推荐
- TASKER 手机在有同一个号码的三个未接电话时自动回复短信
http://tieba.baidu.com/p/3695018030 感谢默默为Tasker吧奉献的人! 配置为>未接来电 任务为>代码>javascriptlet 代码为: va ...
- 关于Hyper-V备份的四大注意事项
尽管Hyper-V备份相对简单,但备份管理员仍需注意四大问题.这四方面的问题在创建备份时可能不太重要,但在备份恢复时影响甚大. 1.对于虚拟机来说不仅意味着虚拟磁盘 就目前来看,企业在执行Hyper- ...
- 基于Java IO 序列化方案的memcached-session-manager多memcached节点配置
在公司项目里想要在前端通过nginx将请求负载均衡,而后台的几组tomcat的session通过memcached(non-sticky模式)进行统一管理,这几组tomcat部署的web app是同一 ...
- 基于CXF框架下的SOAP Webservice服务端接口开发
最近对webservice 进行入门学习,网上也是找了很多的学习资料.总得感觉就是这了解点,那了解点.感觉不够系统,不够容易入门.差不多断断续续看了一个星期了,今天小有成果,把客户端,服务端都搞定了. ...
- OpenCV学习(38) 人脸识别(3)
前面我们学习了基于特征脸的人脸识别,现在我们学习一下基于Fisher脸的人脸识别,Fisher人脸识别基于LDA(线性判别算法)算法,算法的详细介绍可以参考下面两篇教程内容: ...
- C++用iconv进行页面字符转换
在对HTML页面进行爬取时,总会遇到一些不同的编码,而我们通常都不会一一对这些编码进行处理,而是集体转换成相同的编码,也易于装入数据库.此时,iconv便成为一个很方便的工具. iconv 头文件&q ...
- Informatica 常用组件Filter之一 概述
转换类型:已连接.主动 过滤器转换允许您过滤映射中的行.通过过滤器转换从源转换传递所有的行,然后为转换输入过滤条件.所有过滤器转换中的端口均为输入/输出端口,只有符合条件的行才能通过过滤器转换. 在某 ...
- go语言基础之数组做函数参数是值拷贝
1.数组做函数参数是值拷贝 示例: package main //必须有个main包 import "fmt" //数组做函数参数,它是值传递 //实参数组的每个元素给形参数组拷贝 ...
- 什么是ScaleIO中的forwards rebuild和backwards rebuild?
Forward rebuild发生在磁盘或节点挂掉的时候. 这种rebuild的过程的load是均衡到protection domain中所有可用的磁盘和节点上的. 这种rebuild相对于backw ...
- SVN jsvnadmin 安装与基本使用
1. jsvnadmin 介绍 https://code.google.com/p/jsvnadmin/ Svn Admin是一个Java开发的管理Svn服务器的项目用户的web应用.安装好Svn服 ...