原因:
a元素下有一个匿名文本,这个文本外有一个匿名行级盒子,它有的默认vertical-align是baseline的,而且往往因为上文line-height的影响,使它有个line-height,从而使其有了高度,因为baseline对齐的原因,这个匿名盒子就会下沉,往下撑开一些距离,所以把a撑高了。

解决办法
一是消除掉匿名盒子的高度,也就是给a设置line-height:0或font-size:0;

二是给两者vertical-align:top,让其top对齐,而不是baseline对齐

三是给img以display:block,让它和匿名行级盒子不在一个布局上下文中,也就不存在行级盒的对齐问题

前端之旅HTML与CSS篇之a便签中放入其他块元素会撑大高度的原因的更多相关文章

  1. 前端之旅HTML与CSS篇之IE6常见BUG

    1.IE6怪异解析之padding与border算入宽高原因:未加文档声明造成非盒模型解析解决方法:加入文档声明<!doctype html> 2.IE6在块元素.左右浮动.设定marin ...

  2. 前端之旅HTML与CSS篇之block与inline的区别

    display:block;和display:inline;的区别block元素特点: 1)处于常规流中时,如果width没有设置,会自动填充满父容器 2)可以应用margin/padding 3)在 ...

  3. 前端之旅HTML与CSS篇之清除浮动塌陷

    以下内容为转载. 方法1:给浮动的元素的上级添加高度如果一个元素要浮动,那么它的祖先元素一定要有高度.高度的盒子,才能关住浮动.只要浮动在一个有高度的盒子中,那么这个浮动就不会影响后面的浮动元素.所以 ...

  4. 前端之旅HTML与CSS篇之自己总结的关于居中的方法

    1.text-align:center  :在父容器里水平居中 inline 文字,或 inline 元素 2.line-height  与 height 相等时,垂直居中文字(文字垂直水平居中,同时 ...

  5. (转)BAT及各大互联网公司2014前端笔试面试题--Html,Css篇

    BAT及各大互联网公司2014前端笔试面试题--Html,Css篇   很多面试题是我自己面试BAT亲身经历碰到的.整理分享出来希望更多的前端er共同进步吧,不仅适用于求职者,对于巩固复习前端基础更是 ...

  6. BAT及各大互联网公司2014前端笔试面试题--Html,Css篇

    很多面试题是我自己面试BAT亲身经历碰到的.整理分享出来希望更多的前端er共同进步吧,不仅适用于求职者,对于巩固复习前端基础更是大有裨益. 而更多的题目是我一路以来收集的,也有往年的,答案不确保一定正 ...

  7. BAT及各大互联网公司前端笔试面试题--Html,Css篇

    注意 转载须保留原文链接(http://www.cnblogs.com/wzhiq896/p/5931347.html )作者:wangwen896 整理分享出来希望更多的前端er共同进步吧,不仅适用 ...

  8. BAT及各大互联网公司2014前端笔试面试题--Html,Css篇(昨天有个群友表示写的简单了点,然后我无情的把他的抄了一遍)

    某个群友 http://www.cnblogs.com/coco1s/   很多面试题是我自己面试BAT亲身经历碰到的.整理分享出来希望更多的前端er共同进步吧,不仅适用于求职者,对于巩固复习前端基础 ...

  9. 各大互联网公司2014前端笔试面试题–HTML,CSS篇

    Html篇: 1.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? IE: trident内核 Firefox:gecko内核 Safari:webkit内核 Opera:以前是presto ...

随机推荐

  1. postman简单教程-环境变量,全局变量的设置及作用

    讲postman环境变量设置之前,先讲一个小插曲,环境变量.全局变量的区别在于Globals,只能用一组,而Environmen可以设置多组,所以我更喜欢设置环境变量 1.环境变量-Environme ...

  2. 简单hdfs相关操作命令

    HDFS常用操作命令 启动hdfs #start-all.sh 查看hdfs的配置文件 #cat hdfs-site.sh #hadoop fs -put /soft/jdk / #HDFS上传文件命 ...

  3. Alpha第十天

    Alpha第十天 听说 031502543 周龙荣(队长) 031502615 李家鹏 031502632 伍晨薇 031502637 张柽 031502639 郑秦 1.前言 任务分配是VV.ZQ. ...

  4. 在django模板中添加jquery

    路径 /project_name /app_name /templates /index.html /project_name setting.py /static /js jquery.js 导入方 ...

  5. android 自定义ScrollView实现背景图片伸缩(阻尼效果)

    android 自定义ScrollView实现强调内容背景图片伸缩(仿多米,qq空间背景的刷新) 看到一篇文章,自己更改了一下bug: 原文地址:http://www.aiuxian.com/arti ...

  6. android context获取目录详解

    获取 sqlite系统数据库路径 方式1: ApkInfo apkInfo = new ResourceUtil(context).getApkInfo(); APP_PATH = new Strin ...

  7. [ZLXOI2015]殉国

    2057. [ZLXOI2015]殉国 http://cogs.pro/cogs/problem/problem.php?pid=2057 ★☆   输入文件:BlackHawk.in   输出文件: ...

  8. JavaScript简写技巧总结

    在日常工作中,JavaScript一些常用的简写技巧,将直接影响到我们的开发效率,现将常用技巧整理如下: 1. 空(null, undefined)验证     当我们创建了一个新的变量,我们通常会去 ...

  9. 剑指offer-第一个只出现一次的字符

    题目描述 在一个字符串(1<=字符串长度<=10000,全部由字母组成)中找到第一个只出现一次的字符,并返回它的位置   解题思路 由于char类型一共有256种可能,所以开辟一个数组ha ...

  10. 使用Spring Initializr创建项目

    Spring initializr 是Spring 官方提供的一个很好的工具,可以用来用来创建一个Spring boot 的项目.可以选择使用Maven管理或者使用Gradle管理,还可以选择使用的编 ...