如何在一行html中显示2个段落

Question

我正在制作一个测试 html 网页，我需要将 2 个段落放在一行中，因为我有一个用于这两个段落的脚本，但我不能将其仅放入一行（抱歉我的英语不好）完整的 html 代码在这里：https: //pastebin.com/gZmLXxPR，脚本： https: //pastebin.com/wc01gjUy，css样式：https://pastebin.com/d7d3AJFN

var counter = 1;

function upvote() {

  counter = counter + 1;

  document.getElementById("Likes")

    .innerHTML = counter + " Likes";

}

<h1>PANDA</h1>

<img id="imagen1" src="img/panda.jpg">

<p color="blue" id="texto"><em>LIKE SI ES MONO</em></p>

<div id="section">

  <td>

    <p id="Likes">1 Likes</p>

    <p id="DisLikes">1 DisLikes</p>

  </td>

</div>

<img id="upvote" src="img/like.png" hspace="20" vspace="10" onclick="upvote()">

<img id="downvote" src="img/dislike.png" hspace="20" vspace="10" onclick="downvote()">

好的，段落代码是：

<div id="section">

<td>

   <p id="Likes">1 Likes</p>

   <p id="DisLikes">1 DisLikes</p>

</td>

</div> 

所以我只需要把它放在一行中

Answer 1

请务必检查您的 HTML 元素；你永远不应该以<td>你正在使用它们的方式来使用它们。<td>用于<table>元素中。您的代码应该如下所示：超文本标记语言<div id="section">&nbsp; &nbsp; <p class="inline" id="Likes">1 Likes</p>&nbsp; &nbsp; <p class="inline" id="DisLikes">1 DisLikes</p></div>CSS.inline {&nbsp; &nbsp; display: inline-block;}

Answer 2

你可以把它们放在spans 中：<p>&nbsp; &nbsp; &nbsp;<span id="Likes">1 Likes</span>&nbsp; &nbsp; &nbsp;<span id="DisLikes">1 DisLikes</span></p>

Answer 3

您还可以将此行代码添加到 CSS 文件中，以定义您在 HTML 文件上执行的每个段落的行。line-height:26px; display:&nbsp;inline-block;我确信这对你的 CSS 类有用，祝你的项目好运。

Answer 4

使用<span>而不是<p>. 默认情况下<p>是一个段落并占据屏幕的整个宽度