问题:a标签里面包含img标签,出现a标签的高度高于img标签好几个px

解决:

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,让它和匿名行级盒子不在一个布局上下文中,也就不存在行级盒的对齐问题

作者:大地Dudy
链接:https://www.zhihu.com/question/26821863/answer/65552730
来源:知乎
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

 

a标签里面包含img标签,出现a标签的高度高于img标签好几个px的更多相关文章

  1. Atitit.web 视频播放器classid clsid 大总结quicktime,vlc 1. Classid的用处。用来指定播放器 1 2. <object> 标签用于包含对象,比如图像、音

    Atitit.web 视频播放器classid clsid 大总结quicktime,vlc 1. Classid的用处.用来指定播放器 1 2. <object> 标签用于包含对象,比如 ...

  2. jquery判断一个标签是否包含另外一个标签

    jquery判断一个标签是否包含另外一个标签 一.总结 一句话总结: jquery的find方法配合length属性:if($("#video_md_9_1").find(&quo ...

  3. C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值

    //C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值,表达式如下: Regex regImg = new Regex(@"(?is)<a[^>]*?href ...

  4. iframe标签用法详解(属性、透明、自适应高度)

    1.iframe 定义和用法 iframe 元素会创建包含另外一个文档的内联框架(即行内框架). HTML 与 XHTML 之间的差异 在 HTML 4.1 Strict DTD 和 XHTML 1. ...

  5. iframe标签用法详解(属性、透明、自适应高度)(总结)

    <iframe src="http://www.jb51.net" width="200" height="500"> 脚本之家 ...

  6. JAVAWEB开发之JSTL标签库的使用、 自己定义EL函数、自己定义标签(带属性的、带标签体的)

    JSTL  JSTL简单介绍: JSTL的全称:JSP Standard Tag Library,JSP标准标签库 JSTL的作用:   提供给Java Web开发者一个标准通用的标签函数库   和E ...

  7. [原创]java WEB学习笔记40:简单标签概述(背景,使用一个标签,标签库的API,SimpleTag接口,创建一个自定义的标签的步骤 和简单实践)

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  8. JAVA POI替换EXCEL模板中自定义标签(XLSX版本)满足替换多个SHEET中自定义标签

    个人说明:为了简单实现导出数据较少的EXCEL(根据自定义书签模板) 一.替换Excel表格标签方法```/** * 替换Excel模板文件内容 * @param map * 需要替换的标签建筑队形式 ...

  9. 潭州课堂25班:Ph201805201 django框架 第五课 自定义简单标签,包含标签,模型类创建,梳理类创建 (课堂笔记)

    自定义标签同自定义过渡器一样,要创建文件,在配置文件中以APP方法注册,对方法进注册,在 html 文件中引入,.. 由模板传参 在 在配置文件中改时区: 由视图函数传参 包含标签: 当有这种重复的代 ...

随机推荐

  1. Spring boot centos部署启动停止脚本

    原文地址:http://www.cnblogs.com/skyblog/p/7243979.html 使用脚本启动和关闭服务,centos下的脚本启动和关闭可以如下: start(){ now=`da ...

  2. altera tcl

    例子:https://www.altera.com/support/support-resources/design-examples/intellectual-property/embedded/n ...

  3. PHP预定义常量DIRECTORY_SEPARATOR

    PHP预定义常量DIRECTORY_SEPARATOR BY 天涯 · // DIRECTORY_SEPARATOR是一个显示系统分隔符的命令,DIRECTORY_SEPARATOR是PHP的内部常量 ...

  4. 从零开始学习SSH框架笔记之四 几个关键配置文件备忘(模板)

    不多说,直接上代码.关于注释我尽量写详细点. 1.web.xml <?xml version="1.0" encoding="UTF-8"?> &l ...

  5. hdu2049 不容易系列之(4)——考新郎 错排+组合 一共有N对新婚夫妇,N个新娘随机坐成一排,每个新郎只能选一个, 其中有M个新郎找错了新娘,求发生这种情况一共有多少种可能.

    不容易系列之(4)——考新郎 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  6. thinkphp5中的一些关于命名空间的tisp

    1.thinkphp5中公共函数文件common中,不需要use,也可以直接使用vendor中的类文件. 2.在类前面的反斜杠作用是,直接使用最外层的命名空间,有时不想use某个X类,却想使用X类时, ...

  7. flex初始化方法

    initalize是初始化,creationcomplete是创建完成,applicationComplete是应用程序中所有的实例都创建完成后才执行,三者的执行顺序是intalize creatio ...

  8. php生成rss订阅

    代码: <?php $host = $_SERVER['HTTP_HOST']; $xmls = '<?xml version="1.0" encoding=" ...

  9. 在DLL中动态加载其所依赖的dll

    windows下LoadLibrary函数的搜索顺序是先搜索system32等系统环境变量path下注册过的路径,然后是当前路径. 这里的相对路径是指的主exe所在路径,并且相对路径在程序运行过程中可 ...

  10. 输入一个十进制数N,将它转换成R进制数输出(运用递归实现)

    #include<stdio.h> int cnt=0;                             //用来记录每个进制存放的位置 char num[20];   //用来存 ...