font-size:0; 清除display:inline-block元素换行符间隙

看例子:

css:

.dd {background-color: #ddd;}
.dd2 {background-color: #ddd; font-size: 0;}
.dd li {display: inline-block; padding: 8px 12px; background-color: #777; font-size: 14px;}

html:

<ul class="dd">
<li>123</li>
<li>1234</li>
<li>123456</li>
<li>123456789</li>
</ul>
<br>
<ul class="dd dd2">
<li>123</li>
<li>1234</li>
<li>123456</li>
<li>123456789</li>
</ul>
<br>
<div style="font-size: 0;">
<img src="data:images/s_banner03.gif">
<img src="data:images/s_banner02.gif">
</div>

效果图:

清除display:inline-block元素换行符间隙font-size:0;的更多相关文章

  1. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  2. 使用(Unicode字符)让inline水平元素换行

      为了实现上面效果: <dl>     <dt>提问:</dt><dd>为什么没有男朋友?</dd> </dl> <dl ...

  3. CSS3如何去除 inline block 元素之间多出的空格

    display: inline-block 属性很好的避免了元素的浮动问题,但是会有点小问题,就是 inline-block 元素间的回车会被显示为一个空格.然而,我们写代码时,都是用回车来格式化的. ...

  4. display inline or block

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  5. float:left 与display:inline的具体区别?

    设了float:left的元素允许它的右边存在任何元素同行显示,不论是内联元素还是块元素.但它的左边还是不允许存在任何元素与之同行显示,哪怕其它的元素的代码在前,除非也给前面的元素加上float:le ...

  6. display:block inline-block inlined的区别

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  7. 多个inline元素、block元素、inline-block元素在父容器中的换行情况

    1.首先看inine元素的换行情况 <style> *{padding:0;margin:0} div.wrap{width:200px;height:200px;border:1px s ...

  8. display:inline与display:block——行内元素显示与块级元素显示

    display:inline 的作用是设置对象做为行内元素显示,inline是内联对象的默认值(ps:内联对象就是不自动产生换行的元素,比如span) 而我们一般用的div是块级元素,默认displa ...

  9. display:inline 和display:inline-block和display:block的区别

    之前讲过块级元素使用display:block 行内元素使用display:inline 那么今天我们就来区分一下display:inline,display:inline-block和display ...

随机推荐

  1. linux下启动和关闭weblogic(转载)

    在weblogic定义的域中可以找到如下命令: /[youHome]/domains/[yourDomain]/startWebLogic.sh /[youHome]/domains/[yourDom ...

  2. EF架构~终于自己架构了一个相对完整的EF方案

    EF4.1学了有段时间了,没有静下来好好研究它的架构,今天有空正好把它的架构及数据操作这段拿出来,希望给大家带来帮助,对我自己也是一种总结:P 从图中可以看到,我们用的是MVC3进行程序开发的,哈哈, ...

  3. (转)基于RTP的H264视频数据打包解包类

    最近考虑使用RTP替换原有的高清视频传输协议,遂上网查找有关H264视频RTP打包.解包的文档和代码.功夫不负有心人,找到不少有价值的文档和代码.参考这些资料,写了H264 RTP打包类.解包类,实现 ...

  4. Linux随笔-鸟哥Linux基础篇学习总结(全)

    Linux随笔-鸟哥Linux基础篇学习总结(全) 修改Linux系统语系:LANG-en_US,如果我们想让系统默认的语系变成英文的话我们可以修改系统配置文件:/etc/sysconfig/i18n ...

  5. 安装MySQLdb出现的问题

    枫竹梦的环境是自己编译安装的MySQL,安装目录在/usr/local/mysql. 下载MySQLdb,由于网络上大多数的链接都是指向比较老的sourceforge上,而我们安装最新的1.2.5,h ...

  6. Vue中的计算属性和监听器(computed 与 watch)

    react中数据是单向绑定的,而vue中数据是双向绑定的.为什么? 在react中,主要是通过setState 去改变state的值:而在vue中,会自动的触发set 与get 改变属性的值. 在vu ...

  7. poj 1363 Rails (【栈的应用】 刘汝佳的写法 *学习)

    Rails Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 25964   Accepted: 10199 Descripti ...

  8. 关于Linux启动文件rc.local的解惑

    背景 首先,rc.local是Linux启动程序在login程序前执行的最后一个脚本,有的服务器中在rc.local中可能会有一句touch /var/lock/subsys/local,这是干什么的 ...

  9. ssh整合 小例子

    实现了用户的查插删改操作. 原理:struts负责接收.分发请求.spring采用面向接口编程的思想整合整体框架,负责连接数据库.hibernate负责操作数据库语言. 思路: 1.配置struts的 ...

  10. Tensorflow深度学习之十二:基础图像处理之二

    Tensorflow深度学习之十二:基础图像处理之二 from:https://blog.csdn.net/davincil/article/details/76598474   首先放出原始图像: ...