Html中代码换行造成空格间距的问题解析

解决方法:

一、简单粗爆不换行

写代码的时候不要换行,input等在一行输写,那么将解决该问题。但是代码就变得不再那么容易好看。

二、设置父级块的字体大小为0

这样也能解决问题,代码也好看,但是当你设置了父级的字体大小为0时,你里面又要其它字体要显示,可能就得加span等标签去包裹它,并且重新设置字体大小。
三:设置margin-left为-3象素

使得该元素基于原来的位置向左偏移三个象素,也就看不出有空隙了。

对于html内置的内联级标签以及表单元素标签,源代码中连续几个内联级标签中的换行在浏览器中会被解释为一个空格。

包括ie和ff。而这个空格是会被当作一个空白节点(nodeType等于3的节点,就是文字节点)。

对于html内置的块级标签使用了display:inline;则没上述问题。

对于html内置的块级标签之间的换行,ff会当作一个空白节点(用js可以获取到),ie则会忽略掉这个换行。

这个换行在ie和ff的页面上并无任何影响,不会出现空格。

Html中代码换行造成空格间距的问题的更多相关文章

  1. html代码换行造成空格间距问题

    连续几个内联标签或表单元素标签的换行在浏览器会被解释为一个空格. 比如下面代码: <span style="border:1px solid #f20">hello&l ...

  2. 由一个项目需求引发的 - textarea中的换行和空格

    当我们使用 textarea 在前台编辑文字,并用 js 提交到后台的时候,空格和换行是我们最需要考虑的问题.在textarea 里面,空格和换行会被保存为/s和/n,如果我们前台输入和前台显示的文字 ...

  3. 在HTML代码中要如何插入空格?

    超文本标记语言(HTML)会自动忽略空格.平常在编写代码的时候,用空格键.Tab键以及回车键产生的空格,都会被HTML自动忽略.那么我们该用什么方法来实现HTML的空格效果呢?有专门的空格代码吗?不少 ...

  4. Azure DevOps Server (TFS)中代码文件换行问题解决方案(Git)

    之前写过一篇博客"探索TFS Git 库文件换行(CRLF)的处理方式",主要是针对TFVC代码库的. 下面这篇文章说明如何在TFS的Git库中处理代码换行的问题. 概述 在Azu ...

  5. angularjs中类似textarea的换行、空格处理

    背景 今天测试人员测试出来一个显示数据的页面,没有换行. 原因剖析 这个页面是从一个<textarea>的页面拿到的数据,存到数据库中后再返回来的. 1. 知道这点之后,就有了调查方向了: ...

  6. PHP中去除字符串中的换行的方法

    在PHP中,有时候我们需要对字符串的换行进行过滤,比如天涯PHP博客中文章页面的description信息,我是直接截取的文章内容,并过滤掉html符号,最终还要过滤掉其中的换行.下面整理一下常见的去 ...

  7. CSS中控制换行的四种属性

    一.white-space 可以实现HTML中PRE标签的效果,以及单元格的noWrap效果,点此查看示例. Example Source Code 语法: white-space : normal  ...

  8. ASP.NET过滤HTML标签只保留换行与空格的方法

    这篇文章主要介绍了ASP.NET过滤HTML标签只保留换行与空格的方法,包含网上常见的方法以及对此方法的改进,具有一定的参考借鉴价值,需要的朋友可以参考下   本文实例讲述了ASP.NET过滤HTML ...

  9. html中一些莫名的空格

    我们日常用编辑器编辑代码的时候,为了让代码的可读性更高,通常会有换行,空格或者tab键(bootstrap的规则中非常不建议这样做,不过为了方便,我还是比较习惯这样来缩进)的操作. 而这些也就造成了一 ...

随机推荐

  1. iOS常用方法

    1.磁盘总空间大小 + (CGFloat)diskOfAllSizeMBytes {     CGFloat size = 0.0;     NSError *error;     NSDiction ...

  2. hadoop分片分析

    上一篇分析了split的生成,现在接着来说具体的split具体内容及其相关的文件和类.以FileSplit(mapred包下org/apache/hadoop/mapreduce/lib/input/ ...

  3. python学习04——列表的操作

    笨办法学python第38节 如何创建列表在第32节,形式如下: 本节主要是讲对列表的操作,首先讲了 mystuff.append('hello') 的工作原理,我的理解是,首先Python找到mys ...

  4. 第十篇.bootstrap轮播

    使用bootstrap的轮播插件可以向站点添加滑块,内容可以是图像,内嵌框架,视频或其它任何内容,使用轮播插件需要引入bootstrap.min.js. <div id="carous ...

  5. strace命令使用

    在调试的时候,strace能帮助你追踪到一个程序所执行的系统调用.当你想知道程序和操作系统如何交互的时候,这是极其方便的,比如你想知道执行了哪些系统调用,并且以何种顺序执行. 这个简单而又强大的工具几 ...

  6. HttpSession

    (Cookie是用来设置浏览器保存数据的时间的: Session是只要浏览器不关闭,数据则会存在,一旦关闭浏览器数据即消失 ) 1. HttpSession概述 * HttpSession是由Java ...

  7. ueditor 图片上传功能(.net)

    假如下载的net文件 所在工程引用bin文件中的Newtonsoft.Json.dll 在浏览器中运行 `net/controller.ashx`,如果返回 "`{"state&q ...

  8. css测试题

    1.CSS 指的是? 您的回答:Computer Style Sheets 正确答案:Cascading Style Sheets 2.在以下的 HTML 中,哪个是正确引用外部样式表的方法? 您的回 ...

  9. 一步一步搭框架(asp.netmvc+easyui+sqlserver)-01

    一步一步搭框架(asp.netmvc+easyui+sqlserver)-01 要搭建的框架是企业级开发框架,适用用企业管理信息系统的开发,如:OA.HR等 1.框架名称:sampleFrame. 2 ...

  10. jquery中的children()和contents()的区别

    1.children()只会返回元素节点 2.contents()还可以返回文本节点