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. asp.net c#过滤html代码,净化DIV SPAN等

    public static string GetSafeHtml(string val) { if (string.IsNullOrEmpty(val)) { return string.Empty; ...

  2. asp.net ajax控件tab扩展,极品啊,秒杀其它插件

    说明:asp.net ajax控件tab要设置width和height,而且在线文本编辑器放能够放入tab中,也必须是asp.net的控件型在线文本,例如fckeditor,下面是我设置好的配置. & ...

  3. javasript_数据结构和算法_栈

    //-----------------------------------存储结构为数组-------------------------------------------- function St ...

  4. 写程序该选Mac 还是PC ?(转)

    原文链接:http://gogojimmy.net/2012/04/07/why-programmer-should-use-mac/ 序 一个竞争的市场,就会有对立的产生,这世界存在着很多不同的领域 ...

  5. 中国B2B行业将进入后平台时代

    中国的B2B正在进入后平台时代,我们用三个特征来诠释这个词:1.电商平台构建流程闭环服务,从电商平台向综合服务商转变:2.新流量批发策略的落地代表B2B找到了新入口:3.第三方服务的价值变现与第二波创 ...

  6. Office 365 SharePoint 使用Charts Web Part

    如果你在web part->业务数据下找不到Charts Web Part 可以修改你的URL https://goitmch.sharepoint.com/sites/xxxx/_layout ...

  7. SharePoint 2010 + 左侧导航(Left Nav Bar)二级菜单的修改

    SharePoint 2010 + 修改左侧导航类似顶部导航菜单的样式 查找aspmenu的控件,ID为“V4QuickLaunchMenu”,修改分别将属性“StaticDisplayLevels” ...

  8. 什么是Alpha通道?

    图像处理(Alpha通道,RGB,...)祁连山(Adobe 系列教程)****的UI课程 一个也许很傻的问题,在图像处理中alpha到底是什么?  Alpha通道是计算机图形学中的术语,指的是特别的 ...

  9. VScode调试Python

    第一步,确保装上了PYTHON扩展 然后打开文件夹(这个东西必须打开文件夹才能进行调试,不能打开一个文件就调试) 打开文件夹后,那里显示没有配置,这时需要你按下F5 弹出选择环境,点击Python 它 ...

  10. 2、Runtime Area Data

    这个也分为两大部分 1.是线程共享区域 ·线程共享区域又包括两部分Heap(堆)和方法区(Perm) 2.是线程独享区域 这个也包括两大部分程序计数器和栈 栈(又包括两部分:VM 栈和本地方法栈)