Html 跨多行包装标记时如何避免空格
朋友们。我正在使用atom编写html代码。每次输入“p”字,自动生成三行代码:Html 跨多行包装标记时如何避免空格,html,css,line-breaks,atom-editor,spaces,Html,Css,Line Breaks,Atom Editor,Spaces,朋友们。我正在使用atom编写html代码。每次输入“p”字,自动生成三行代码: 最终编辑: 这个答案是错误的,我知道它是错误的。我把它留给子孙后代,因为下面的一些信息仍然有用 编辑:忘记我在下面写的所有内容——问题是CSS设置为显示为内联块,而不是内联 .inline { /*display:inline-block;*/ display: inline; } 查看此帖子: 这是内联块元素已知的预期行为。这不仅仅是因为元素中的新行而产生的空间——即使它们在同一行上
最终编辑:
这个答案是错误的,我知道它是错误的。我把它留给子孙后代,因为下面的一些信息仍然有用
编辑:忘记我在下面写的所有内容——问题是CSS设置为显示为
内联块
,而不是内联
.inline {
/*display:inline-block;*/
display: inline;
}
查看此帖子: 这是内联块元素已知的预期行为。这不仅仅是因为元素中的新行而产生的空间——即使它们在同一行上也会发生,就像这样:
<p class="inline">Hi, friend</p>
<p class="inline">s</p>
<p class="inline">Hi, friend</p><!--
--><p class="inline">s</p>
你好,朋友
s
有一些已知的技术可以处理这种行为(参见和-,没有一种是超级漂亮的,但这是实际情况) 总结以上链接,它们基本上是试图以一种不太可怕或痛苦的方式删除编辑器中的空格的方法。我首选的方法是注释掉空格,如下所示:<p class="inline">Hi, friend</p>
<p class="inline">s</p>
<p class="inline">Hi, friend</p><!--
--><p class="inline">s</p>
你好,朋友
…但这真的取决于偏好
或者,您可以利用其他选项,如或来实现所需的功能。您好,您可以删除空白,请参见我的小提琴 你可以这样排成一行
<p>Hi, friend</p><p>s</p>
p{
margin: 0;
display: inline;
}
你好,朋友
p{
保证金:0;
显示:内联;
}
或者用这个方法
<div class="parent1">
<p>Hi, friend</p>
<p>s</p>
</div>
p{
margin: 0;
display: inline;
}
.parent1 {
font-size: 0;
}
.parent1 p {
font-size: 16px;
}
嗨,朋友
p{
保证金:0;
显示:内联;
}
.parent1{
字号:0;
}
.1 p{
字体大小:16px;
}
尝试显示:表格单元格
-如下所示:
.inline{
显示:表格单元格;
}
嗨,朋友
s
不确定这是否是您的真实用例,但请记住,
表示一个段落。通常,如果您将所有内容放在同一行,您会希望使用
。@Brad是的,您是对的。我在本例中简化了我的实际用法,在本例中,如果我编写代码嗨,朋友和>s
在两行中,它也会在friend
和s
之间创建一个空格。因此,如果不在一行中写入代码,是否可以避免空格?阅读答案后,我认为已经有一个很好的解决方案:。感谢@anied.Hi,谢谢你的回答。我将“内联块”改为“inline”,它仍然不起作用。实际上,当我使用“inline block”并将代码写在一行中时,它将显示我想要的结果:嗨,朋友。
s
。谢谢你的帖子(实际上它对我非常有用).是的,我昨晚意识到我走错了方向,但无法从StackExchange应用程序中删除答案。谢谢。我不知道它是如何工作的,但对这种情况也很有用。谢谢。很抱歉,我之前误读了你的答案并接受了它。但是,对于你的第二个解决方案,我对它做了一些更改,以解决我的ca中的问题se:1.把嗨,朋友
按照我的意愿分成3行;2.边距:0;
不需要,所以我删除了它;3.把显示:内联;
改成显示:内联块;
。很高兴你能猜出来谢谢你。你真好。