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

如图(事例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. 【洛谷2113】看球泡妹子 DP背包

    看球泡妹子 题目背景 2014年巴西世界杯开幕了,现在满城皆是世界杯,商家们利用它大赚一笔,小明和小红也借此机会增进感情. 题目描述 本届世界杯共有\(N\)支球队,\(M\)场比赛.男球迷小明喜欢看 ...

  2. php 镜像richarvey/nginx-php-fpm的ngnix配置

    1.遇到错误option error_page 405 =200 $request_uri; location ~ ^/(json)/ { # root /data/website/xxxx.com/ ...

  3. centos虚拟机设置静态ip

    1.虚拟机网络配置设置为桥接模式 2.设置配置文件: vi /etc/sysconfig/network-scripts/ifcfg-ens33 DEVICE=ens33 HWADDR=:0c::c3 ...

  4. MySQL 简洁 数据操作 增删改查 记不住的 看这里把

    1.库操作====================== 1.创建 CREATE DATABASE DB2 charset utf8; 2.删除 DROP DATABASE db2; 3.使用(进入) ...

  5. ansys 14.0

    张建伟等.2012.12 人民邮电 一天一本书,这种感觉 真是爽啊. 但我觉得什么也没学到. 话说回来,此authors 确实书写得比较一般,实例不如百度文档上的WORD实例,理论不如我看的那本CFD ...

  6. FFMpeg 版本错误

    错误情况: relocation error: /usr/local/lib/libavfilter.so.3: symbol sws_get_class, version LIBSWSCALE_2 ...

  7. linux Ubuntu14.04 python(c++版本) tesorflow(python版本)c++

    一.环境变量配置: export M2_HOME=/home/ustcjing/Maven/apache-maven- export JAVA_HOME=/usr/lib/jvm8/java expo ...

  8. spark第四篇:Running Spark on YARN

    确保HADOOP_CONF_DIR或者YARN_CONF_DIR指向hadoop集群配置文件目录.这些配置用来写数据到hdfs以及连接yarn ResourceManager.(在$SPARK_HOM ...

  9. Docker学习笔记--Docker 启动nginx实例挂载目录权限不够(转)

    今天在启动一个docker 运行nginx实例,在挂载目录时,出现访问静态目录时,权限不够 执行的命令是: docker run --name my-nginx -d -p 80:80 --resta ...

  10. DP Intro - OBST

    http://radford.edu/~nokie/classes/360/dp-opt-bst.html Overview Optimal Binary Search Trees - Problem ...