使用标记隐藏删除html代码段的第一个换行符空白行

概述我正在开发一个有一些代码的网站,我想写一下： <pre><code>line 1line 2</code></pre> 但是这会在开头产生一个空行,就像输出一样 [A Blank line in here that I don't want] line 1line 2 我知道如果我这样写,就没有空白行,但我喜欢写如上所示. <pre><code>line 1line 2</co 我正在开发一个有一些代码的网站,我想写一下：

<pre><code>line 1line 2</code></pre>

但是这会在开头产生一个空行,就像输出一样

[A Blank line in here that I don't want]    line 1line 2

我知道如果我这样写,就没有空白行,但我喜欢写如上所示.

<pre><code>line 1line 2</code></pre>

如果可能的话,请建议我使用CSS隐藏或删除第一个换行符/空白行,以便我可以在我的代码中保留换行符,而不会在我的所有代码部分的开头出现空白行.

解决方法 我认为可行的唯一方法是：

只使用一点JavaScript：

const code = document.querySelectorAll("pre code");[...code].forEach(el => el.textContent = el.textContent.replace(/^\n/,''));

pre {border: 1px solID #ddd;}

<pre><code>1 line2 line4 line</code></pre><pre><code>1 line2 line4 line</code></pre><pre><code>2 line. (Keep intentional newline above)4 line</code></pre>

CSS

另一种,真正糟糕的方法是只使用CSS pre：first-line {Font-size：0; } – 但这真的很糟糕,因为它迫使你总是把第一行留空(否则由于Font-size：0,这样的文字不会出现在屏幕上)

白空间失败

任何其他方式,比如在< pre>上播放白色空格组合.和<代码>标签不会得到任何所需的东西.

总结

以上是内存溢出为你收集整理的使用标记隐藏/删除html代码段的第一个换行符/空白行全部内容，希望文章能够帮你解决使用标记隐藏/删除html代码段的第一个换行符/空白行所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。