无法在简单的HTML网页中删除空白空间

我无法删除绿色和红线之间的空间。我已经尝试了一切，仍然无法做到。拜托，有人帮忙！

请做任何事情，但请删除绿色和红线之间的空间

<html>
<head>
<!-- CSS --> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.9.0/themes/prism-coy.css" />
<!-- JS --> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.9.0/prism.min.js"></script>
<style>
pre{margin:0px;border:2px solid red;}
pre::before,pre::after,code::before,code::after{height:0!important;}
pre[class*="language-"]:before, pre[class*="language-"]:after{height:0px!important;display:inline-block;}
code{border-bottom:2px solid green;}
</style>
</head>
<body>
<pre class="brush: html line-numbers  language-html">
<code ="language-html">&lt;html&gt;
&lt;head&gt;&lt;/head&gt;
&lt;body&gt;
Hi, my name is Peter Martin. 
This is my first program in HTML.
&lt;/body&gt;
&lt;/html&gt;</code>
</pre>
</body>
</html>

问题不在您的CSS中，这是您关闭后的新行 </code>部分。如果将其删除，则空间将消失。发生这种情况是因为Pre元素中的文本以固定宽度字体显示，并且保留了空格和线路断裂。

<html>
<head>
<!-- CSS --> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.9.0/themes/prism-coy.css" />
<!-- JS --> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.9.0/prism.min.js"></script>
<style>
pre{margin:0px;border:2px solid red;}
pre::before,pre::after,code::before,code::after{height:0!important;}
pre[class*="language-"]:before, pre[class*="language-"]:after{height:0px!important;display:inline-block;}
code{border-bottom:2px solid green;}
</style>
</head>
<body>
<pre class="brush: html line-numbers  language-html">
<code ="language-html">&lt;html&gt;
&lt;head&gt;&lt;/head&gt;
&lt;body&gt;
Hi, my name is Peter Martin. 
This is my first program in HTML.
&lt;/body&gt;
&lt;/html&gt;</code></pre>
</body>
</html>

该空间是由</code>＆amp;</pre>标签如果您从这样的标签中删除空间，则应工作</code></pre>。

您的代码正在读取HTML。HTML不会读取空间，但是在您的代码中。

相关内容

最新更新

热门标签：