今天在切图的时候,碰到一个兼容性的问题,很幸运最后通过张金鑫老师的文章解决了这个问题!但在阅读张老师文章的时候,我有个地方不明白,在网上查了下也没找到我想要的答案,后来自己想了半天好像是这么回事,现在我把我的想法写出来,如果有不对的地方,大家一定要指出哦。

如图(事例1):

这是张老师文章中的一段事例代码,代码的结构是一个div包括着3个a元素,每个a元素之间都是各占一行,所以显示在浏览器上时,a元素之间会有一个间隙,如图:

那么问题来了!将代码改成这样,如图(事例2):

最后的结果是这样的,如图:

a元素之间的间距居然消失了!为什么在代码上的一些轻微的改变就会产生不一样的结果呢?这让处女座的我陷入了深深的思考……@-@!

我是这么理解的:事例1中的代码,a元素与a元素之间的间距是属于元素与元素之间的距离,最终在浏览器中显示空白,借用张老师中文章的一段话“元素间留白间距出现的原因就是标签段之间的空格,因此,去掉HTML中的空格,自然间距就木有了。”将视角转到事例2,在图片中,如下:

代码与代码存在空白的部分,但这空白的部分是属于元素与内容之间的距离(a元素与它的内容)不是张老师在文章中提到的元素与元素间的留白间距,所以在浏览器中显示出来就不会产生留白间距。so?在代码中的一些轻微的改变就有可能帮助你解决大问题哦!如上例中将元素与元素的间距变成元素与内容之间的间距,就帮我解决了兼容性的问题!

以上就是我在今天所收获的知识,当然我的理解可能会有错误,但如果你有不同的想法一定要说出来哦!评论~

html中通过移除空格的方法来解决浏览器上的留白间距该怎么理解?的更多相关文章

  1. Python中常见字符串去除空格的方法总结

    Python中常见字符串去除空格的方法总结 1:strip()方法,去除字符串开头或者结尾的空格>>> a = " a b c ">>> a.s ...

  2. oracle中去掉回车换行空格的方法详解

    函数: 1.translate语法:TRANSLATE(char, from, to)用法:返回将出现在from中的每个字符替换为to中的相应字符以后的字符串.            若from比to ...

  3. Shell中去除字符串前后空格的方法

    [root@local ~]# echo " A BC " A BC [root@local ~]# eval echo " A BC " A BC 或者 [r ...

  4. JS中json数组多字段排序方法(解决兼容性问题)(转)

    前端对一个json数组进行排序,用户需要动态的根据自己的选择来对json数据进行排序. 由于后台表设计问题所以不能用sql进行排序,这里用到了js的sort方法. 如果对单字段排序,那么很简单,一个s ...

  5. PHP中调用SVN命令更新网站方法(解决文件名包含中文更新失败的问题)

    想说写一个通过网页就可以执行 SVN 升级的程序,结果并不是我想得那样简单,有一些眉角需要注意的说. 先以 Apache 的用户帐号执行 SVN checkout,这样 Apache 才有 SVN 的 ...

  6. Ubuntu中查看硬盘分区UUID的方法(所有Linux目录的解释)

    在Ubuntu中UUID的两种获取方法,至于UUID是什么,你可以大概理解为分区的标识符,像条形码那样. 在终端中输入下面的命令就可心查看到分区UUID了.命令1.sudo blkid 命令2.ls ...

  7. oracle中如何对字符串进行去除空格的方法

    oracle中如何对字符串进行去除空格的方法 今天学习了一下oracle中如何对字符串进行去除空格的方法,这里总结一下.了解到的方法主要有两种:Trim函数以及Replace函数.下面我详细的介绍一下 ...

  8. 空格&nbsp在不同浏览器中显示距离不一致问题解决方法

      在ie.firefox.chrome浏览器上显示的效果不太一样,主要是前面的空格宽度不同. 网上资料说不同的浏览器会有不同的默认字体.一般 IE默认字体都是宋体,而firefox和chrome的默 ...

  9. Java中去除字符串中空格的方法

    昨天写了一个关于Excel文件处理的脚本,在字符串匹配功能上总是出现多余不正确的匹配,debug调试之后,发现一个坑. ------->代码中字符串使用了replaceAll()方法,去除了所有 ...

随机推荐

  1. SQL SERVER下有序GUID和无序GUID作为主键&聚集索引的性能表现

     背景 前段时间学习<Microsoft SQL Server 2008技术内幕:T-SQL查询>时,看到里面关于无序GUID作为主键与聚集索引的建议,无序GUID作为主键以及作为聚集索引 ...

  2. C++_IO与文件3-用cin进行输入

    接下来讨论的是如何给程序提供数据? cin对象将标准输入表示为字节流. 通常情况下是通过键盘来生成这种字节流 cin对象根据接收值得变量类型,使用其方法将字符序列转换为所需的类型. cin>&g ...

  3. Aop之使用Castle动态代理实现对方法的拦截

    using System; using System.Linq; using Castle.DynamicProxy; namespace AopTest { class AopTest { stat ...

  4. springboot(六)-使用shiro

    前提 写之前纠结了一番,这一节放在shiro里面还是springboot里面.后来想了下,还是放springboot里吧,因为这里没有shiro的新东西,只有springboot添加了新东西的使用. ...

  5. 1093 字符串A+B (20 分)

    给定两个字符串 A 和 B,本题要求你输出 A+B,即两个字符串的并集.要求先输出 A,再输出 B,但重复的字符必须被剔除. 输入格式: 输入在两行中分别给出 A 和 B,均为长度不超过 10​6​​ ...

  6. Selenium WebDriver 中鼠标和键盘事件分析及扩展

    [From] http://www.51testing.com/html/18/631118-861557.html 在使用 Selenium WebDriver 做自动化测试的时候,会经常模拟鼠标和 ...

  7. Oracle Pipelined Table Functions简介

    转自: http://www.linuxidc.com/Linux/2011-05/35797.htm //概况   //基本上,当你希望一个PLSQL(或者java或者c)程序作为数据源,而不是表, ...

  8. linux下安装软件的方法(mariadb)

    一.方式 1. rpm (不推荐使用) 2. yum 安装(非常方便快捷) 3. 编译安装(需要自定制的时候才使用) 二.技术栈 #闭源收费的技术栈: svn + java + apache(web服 ...

  9. 字符型图片验证码,使用tensorflow实现卷积神经网络,进行验证码识别CNN

    本项目使用卷积神经网络识别字符型图片验证码,其基于 TensorFlow 框架.它封装了非常通用的校验.训练.验证.识别和调用 API,极大地减低了识别字符型验证码花费的时间和精力. 项目地址: ht ...

  10. java se系列(三) 顺序语句、if...else、switch、While、do-while、for、break、continue

    1 顺序语句 语句:使用分号分隔的代码称作为一个语句. 注意:没有写任何代码只是一个分号的时候,也是一条语句,称作空语句. 顺序语句就是按照从上往下的顺序执行的语句. 2 判断(if…else) 什么 ...