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

其他解决办法也有,但这些都是从根本上解决问题

为什么a标签中使用img后的高度多了几个像素?的更多相关文章

  1. a标签中使用img后的高度多了几个像素

    a元素下有一个匿名文本,这个文本外有一个匿名行级盒子,它有的默认vertical-align是baseline的,而且往往因为上文line-height的影响,使它有个line-height,从而使其 ...

  2. a标签中使用img后的高度多了4px

    前两天,在做一个网站的时候,发现a标签中使用img后的高度多了4px,各种纠结. 最后,仔细分析,终于找到原因了,因为img是行内元素,默认display: inline; 它与文本的默认行为类似,下 ...

  3. 为什么a标签中使用img后,高度多了几个像素?

    <li><a href="#"><img src="images/audio.jpg" alt="">& ...

  4. 关于网站开发中div标签中设置宽度后其中文本溢出的原因和解决方法

    一.问题产生的原因 当我们为div标签声明了宽度,但是仍然会出现文本越界的情况,不知道大家有没有发现,只有文本内容为单词或者纯数字的时候才会出现这种情况为此我特意测试了两种情况,结果如下: ①当文本内 ...

  5. PDA手持扫描资产标签,盘点完成后将数据上传到PC端,固定资产系统查看盘点结果

    固定资产管理系统介绍: 致力于研发条码技术.集成条码系统的专业性公司,针对客户的不同需求,提供一站式的企业条码系统解决方案:包括功能强大的软件系统.安全可靠的无线网络.坚固耐用的硬件系统.灵活易用的管 ...

  6. a 标签中加 onclick事件,根据事件中的校验情况来决定是否执行a标签的链接

    a 标签中加 onclick方法后,先执行onclick方法,在去执行a标签href下属性对应的动作,如果不想执行href属性下动作需要用false作为返回值. <a href="ht ...

  7. meta标签中的http-equiv属性使用介绍(转载)

    meta是html语言head区的一个辅助性标签.也许你认为这些代码可有可无.其实如果你能够用好meta标签,会给你带来意想不到的效果,meta标签的作用有:搜索引擎优化(SEO),定义页面使用语言, ...

  8. 5.Struts.xml标签中的一些小技巧

    1.为Action属性注入值如给actions包下的test.java类中变量username赋值为"xingyun"在struts.xml中添加下面这段代码: <strut ...

  9. a 标签中调用js的几种方法 文章摘自他人

    我们常用的在a标签中有点击事件:1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题 ...

随机推荐

  1. 设计模式之十三:适配器模式(Adapter)

    适配器模式: 将一个类的接口转换成另外一个期望的类的接口.适配器同意接口互不兼容的类一起工作. Convert the interface of a class into another interf ...

  2. [AngularJS] Transclude -- using what existing in DOM to replace the template elements in directive

    var app = angular.module("phoneApp", []); app.controller("AppCtrl", function($sc ...

  3. C 栈 链式存储

    #ifndef _MY_LINKSTACK_H_ #define _MY_LINKSTACK_H_ typedef void LinkStack; LinkStack* LinkStack_Creat ...

  4. JavaScript/jQuery选择器简介

    DOM提供的选择器 选择器是帮助我们选择页面元素的工具,在网站制作中常常会涉及到某个元素的改变,通过选择器提取这些元素可以很轻易的实现(DOM术语把所说的“元素”称作是“节点”).JavaScript ...

  5. javascript调试 console

    Console命令详解,让调试js代码变得更简单   Firebug是网页开发的利器,能够极大地提升工作效率. 但是,它不太容易上手.我曾经翻译过一篇<Firebug入门指南>,介绍了一些 ...

  6. windows 7文件共享方法

    现在家里有几台电脑是很常见的,把家里的几台电脑组成局域网,共享文件.联机游戏是非常有必要的,但是组建局域网又是很多朋友永远的痛,需要设置工作组.设置登录方式.打开服务等等,时常还会出点小问题而无法共享 ...

  7. C# 之 服务端获取远程资源

    获取指定网页的远程资源可使用 WebClient.WebRequest.HttpWebRequest 三种方式来实现.当然也可使用webBrowse,webBrowse不做介绍. 通过 System. ...

  8. centos6.5 安装jdk7和tomcat7

    JDK安装: 安装说明 系统环境:centos-6.5安装方式:rpm安装软件:jdk-7-linux-x64.rpm下载地址:http://www.oracle.com/technetwork/ja ...

  9. SQL的几道题目

    1.构造数据插入方案表t_project_finish表 a)将addtime更新为当前时间的前一天 首先想到的是addtime=addtime-1,然后就开始验证这个想法. 插入一行数据,包括主键和 ...

  10. onsubmit表单验证

    <script type="text/javascript"> function check(){ var username=document.getElementBy ...