Question

请参阅此页

http://www.radioclever.stream/

正如你所看到的那样输出：

Trenutno：你是Ellie Goulding - 你移动的方式 Slušaoci：
1 1

但我想要

Trenutno：Ellie Goulding - 你移动的方式 Slušaoci：1

我尝试了在stackoverflow上找到的任何东西，没有任何帮助。这是源代码

        <div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px">Trenutno:</div><div class="onAir" id="track-title" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px">Changing song ...</div>
        <div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px">Slušaoci:</div><div class="onAir" id="listeners" style="color:#fff;background:#0277bd;padding:0 10px 20px 10px;font-family:Montserrat;font-size:14px"></div>

Answer 1

您可以使用float:left。
这是怎么回事：

<div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px; float:left;">Trenutno:</div>
<div class="onAir" id="track-title" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px; float:left;">Changing song ...</div>
<div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px;">Slušaoci:</div>
<div class="onAir" id="listeners" style="color:#fff;background:#0277bd;padding:0 10px 20px 10px;font-family:Montserrat;font-size:14px;"></div>

或display: inline-block 这应该是这样的：

<div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px;display: inline-block;">Trenutno:</div>
<div class="onAir" id="track-title" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px;display: inline-block;">Changing song ...</div>
<div class="onAir" style="color:#fff;background:#0277bd;font-family:Montserrat;font-size:14px">Slušaoci:</div>
<div class="onAir" id="listeners" style="color:#fff;background:#0277bd;padding:0 10px 20px 10px;font-family:Montserrat;font-size:14px"></div>

Answer 2

这里是带有容器的代码，为了避免重复每个<div>中的样式，我把它放在<div>容器的样式中

<div style=";background:#0277bd;color:#fff;font-family:Montserrat;font-size:14px;">
  <div class="onAir" style="display: inline-block;">Trenutno:</div>
  <div class="onAir" id="track-title" style="display: inline-block;">Changing song ...</div><br>
  <div class="onAir" style="display: inline-block">Slušaoci:</div>
  <div class="onAir" id="listeners" style="display: inline-block">1</div>
</div>

如果您想在中心

，请点击此处

<div style=";background:#0277bd;color:#fff;font-family:Montserrat;font-size:14px;text-align: center;">
  <div class="onAir" style="display: inline-block;">Trenutno:</div>
  <div class="onAir" id="track-title" style="display: inline-block;">Changing song ...</div><br>
  <div class="onAir" style="display: inline-block">Slušaoci:</div>
  <div class="onAir" id="listeners" style="display: inline-block">1</div>
</div>

如果您想要一行，请删除<br>

将两个div标签对齐在一行中

2 个答案: