背景：昨天写过一个div包裹图片的html，已经reset了所有的div，但还是发现img与div底部会有3px的间距，我检查了所有的css，发现并未发现什么问题，结果度娘了一下，发现好多朋友都遇到了这个问题，先找到解决方案再说，伟大的网友提供了3中解决方案：

方案一:div{font-size:0};
方案二:img{ display:block};
方案三:img{vertical-align:top;}
其实还有一种 div{ margin-bottom:-3px };
问题是解决了，但我是好奇宝宝，不知道是什么原因，于是今天再次度娘
 

img是一种类似text的元素，在结束的时候，会在末尾加上一个空白符，所以就会多出3px。

希望对大家有所帮助，记录下来只为了自己也能记住

关于div包裹img，底下多出3px间隙的问题的更多相关文章

  1. div里包含img底部多出3px的解决办法

    如果将一个img放在div里面,你会发现在img下面无端端的就多出3px的空白出来.padding.margin.border都设为0,无效!那么怎么解决这个问题呢? 问题图: 解决后的效果: 这个B ...

  2. 使用yii的layout，加入<?php echo $content; ?>这句话时，它会自动在子页面上面添加一个div包裹

    使用yii的layout,加入<?php echo $content; ?>这句话时,它会自动在子页面上面添加一个div包裹,而且div的id命名为id=content,这个和已有id重复 ...

  3. 三行代码接入，社交软件打字时底下弹出的表情布局,自定义ViewPager+页面点标+各种功能的android小框架。

    (转载请声明出处:http://www.cnblogs.com/linguanh/) 前言: 接上次分享的 ListView 动态加载类,入口:http://www.cnblogs.com/lingu ...

  4. DIV JS CSS 轻量级弹出层 兼容各浏览器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 纯div+css制作的弹出菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. div滑入与滑出

    html <div class="pop_tit"> <span class="p_tit1" title="大连未来城LECITY ...

  7. div包裹页面后多余部分没有显示，也没滚动条 overflow 属性设置

    今天弄个div套着一个页面结果那个页面超出范围后页面没有滚动条可以滚动浏览下面的内容,原来是设置了overflow的hidden属性 visible 默认值.内容不会被修剪,会呈现在元素框之外. hi ...

  8. 1.横向滚动条,要设置两个div包裹. 2. 点击切换视频或者图片. overflow . overflow-x

    1.横向滚动条. div.1 > div.2 > img img  img 第一: 设置 div.1 一个固定的宽度 和高度  . 例如宽度 700px;  高度是 120px; 设置 o ...

  9. 如何让BootStrap栅格之间留出空白间隙呢？

    BootStrap栅格之间留出空隙 BootStrap栅格系统可以把我们的container容器划分为若干等分,如果想要每个部分之间留出一定的空隙,我们很可能首先想到的方法就是用margin外边距来使 ...

随机推荐

  1. Sticks Problem

    Sticks Problem poj-2452 题目大意:给你一串n个数的数列a,上面的数为a1到an.我们求最大的y-x,其中,y和x满足1.x<y 2.任意的x<i<y,都有ai ...

  2. 查看http的并发请求数与其TCP连接状态

    [root@new-web7 ~ ::]#netstat -na | awk '/^tcp/ {++S[$NF]} END {for(i in S) print i, S[i]}' TIME_WAIT ...

  3. Laravel 中缓存驱动的速度比较

    缓存是web开发中重要的一部分,我相信很多人和我一样,经常忽略这个问题. 随着工作经验的累积,我已经意识到缓存是多么的重要,这里我通过 Scotch 来解释一下它的重要性. 通过观察发现,Scotch ...

  4. Android学习链接大放送

    虽然贴链接这种事情..真是一种很偷懒的做法... 但是我一个小菜鸟,果断还是要以多向别人学习为主... 好资源要和大家分享对不对! 况且..放博客里..比收藏夹的利用几率要大一点! 原作者应该也很喜欢 ...

  5. 使用listview空控件展示数据

    1.使用listview控件可以一次性的将有关的全部图像保存在控件中,建立集合图像. 图像列表控件的主要属性 属性                                           ...

  6. HTTP缓存带来的“bug”--HTTP 协议 Cache-Control

    问题描述 先说背景.网站是用PHP开发的,未用任何框架,代码结构也非常简单.运行于阿里云服务器,并采用其CDN来做分发.根据业务需求,有的页面会判断用户浏览器类型,依此来选择PC或者手机端内容. 在一 ...

  7. JavaScript(第六天)【函数】

    函数是定义一次但却可以调用或执行任意多次的一段JS代码.函数有时会有参数,即函数被调用时指定了值的局部变量.函数常常使用这些参数来计算一个返回值,这个值也成为函数调用表达式的值. 一．函数声明   函 ...

  8. C语言程序设计（基础）- 第7周作业

    为了防止误解,自从本周开始ppt.pta作业.博客作业的命名均与学校教学周一致. 要求一(20经验值) 完成PTA中题目集名为<usth-C语言基础-第七周作业>和<usth-C语言 ...

  9. C语言第九次作业

    一.PTA实验作业 题目1:统计大于等于平均分人数 1. 本题PTA提交列表 2.设计思路 float i为循环变量,sum=0,count=0来表示所求人数 float *p=s来储存首地址 for ...

  10. 小草手把手教你 LabVIEW 串口仪器控制——初识VISA串口

    有些人,学习一样东西时候,喜欢现成的例子.很多人学习一门技术,都喜欢现成的例子开始,比如学单片机的啊,最开始都是修改的例子吧,学语言的也是.最开始都是模仿.这个年头看书上的理论知识太浪费时间了.所以啊 ...