-2

呈现不在我的源代码中的 DOM 时会出现换行符，将内容推到不合适的位置。为什么？我该如何解决？这是我的代码：

<div class="float-left" style="position:relative;left:15px">
    <h2 style="color:#323C41;margin-bottom:0;">A New Hope</h2>
    <p style="color:#323C41;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vehicula nisl at hendrerit ornare. Ut non ipsum urna. Praesent non.</p>
</div>

当我在 Chrome 中检查页面时，它会显示：

<div class="d-flex justify-content-center align-items-center bg-grey-kr fg-navy-kr secondary">
    <br>
    <img src="/images/testers/rebels.png" alt="Rebel symbol" class="rebel"><br>    <div class="float-left" style="position:relative;left:15px">
    <br>        
    <h2 style="color:#323C41;margin-bottom:0;">A New Hope</h2>
    <br>        
    <p style="color:#323C41;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus vehicula nisl at hendrerit ornare. Ut non ipsum urna. Praesent non.</p>
    <br>    
</div>

这导致我的页面看起来像这样：在此处输入图像描述

当我删除换行符时，我看到了预期的结果：在此处输入图像描述

感谢您检查这一点。我搜索了一上午，找不到答案。如果很明显，请提前道歉！

4

1 回答 1

0

问题来自于从 Hexo 工具直接将 HTML 代码添加到我的“新页面”中。Hexo 是一个将 Markdown 文件编译成静态、实时页面的博客工具。每当我按回车键在新行上编写代码时，Markdown 就好像我在文本编辑器上按回车键一样。将代码全部移到一行解决了这个问题。

无法在网上找到答案，但是当我想通了之后，我想将其发布在这里以提高知名度。

于 2018-06-22T16:03:09.657 回答