HTML:

<div class="test"><img src="body2.jpg" alt=""></div>

CSS:

*{margin:;padding:;}
.test img{height: 100px;}

img的外边距和内填充均为0,然而.test的内容高度大于img的高度

img元素是一个匿名文本,该文本有一个匿名行级盒子,它的默认vertical-align是baseline,又因为上下文line-height的影响,它有一个line-height,从而使其所占高度变大,盒子下沉,往下撑开了一些距离。

从根本上解决的办法:

  1. 给其父元素设置line-height:0或font-size:0;
  2. 给img设置top对齐;
  3. 给img的显示设置为display:block;

PS:http://segmentfault.com/q/1010000003938500

最新文章

  1. 【Phylab2.0】Beta版本项目展示
  2. idea开发工具破解地址
  3. SDDC-SDN-SDS
  4. 兼容IE、Firefox的背景半透明内容不透明设置
  5. tomcat bin 中startup.sh中的环境变量配置
  6. AndroidManifest.xml 详解
  7. cmd执行mssql脚本或者执行mysql脚本
  8. SQL注入实验,PHP连接数据库,Mysql查看binlog,PreparedStatement,mysqli, PDO
  9. OSPF ProcessID(进程号)详解
  10. Android调试工具及方法
  11. 数字转化成字符串C语言
  12. C++编译器函数模版机制剖析 - 函数模版的本质
  13. CC2530芯片介绍
  14. poj3094---对字符串的处理
  15. WebStorm和IntelliJIEDA软件注册码网站(手动填写)
  16. LeetCode 628. Maximum Product of Three Numbers (最大三数乘积)
  17. 多对多中间表详解 -- Django从入门到精通系列教程
  18. c++代码的编译
  19. asp.net core 系列 15 中间件
  20. 【转】Java并发编程:Thread类的使用

热门文章

  1. CSS定义网页滚动条
  2. Linux下安装memcached图文版
  3. EF有外键的查询
  4. AOI
  5. android批量文件上传(android批量图片上传)
  6. 一次处理ORA-07445的历险记(转)
  7. 【转】Linux下tar.xz结尾的文件的解压方法--不错
  8. 【BBST 之伸展树 (Splay Tree)】
  9. 不得不看的JVM内存管理
  10. Linux Top 命令