Question

我看到有很多类似的问题，但是还找不到解决方案。

我的HTML代码：

<p class="ref" style="display:inline">
<p class="mini-caps">albums</p>: 
  Scum
  (1987) ; 
  Bootlegged in Japan
  (1998)
</p>
<p class="ref">
<p class="mini-caps">compilation </p>: 
  Noise for Music’s Sake 
  (2 CD, 2003)
</p>
<p class="ref">
  <p class="mini-caps">album</p>: 
  Illmatic 
  (1994)
</p>

我尝试用display：inline设置p.ref样式，但没有成功。

我想要的输出：

相册：Scum（1987）；在日本走私（1998）

编译：音乐方面的噪音（2 CD，2003）

专辑：病态（1994）

Answer 1

为什么使用p标签？您可以使用div和span正确地做到这一点。

<div class="ref">
    <span class="mini-caps">albums</span>: 
    <span>Scum (1987) ; Bootlegged in Japan (1998)</span>
</div>
<div class="ref">
    <span class="mini-caps">compilation </span>: 
    <span>Noise for Music’s Sake (2 CD, 2003)</span>
</div>
<div class="ref">
    <span class="mini-caps">album</span>: 
    <span>Illmatic (1994)</span>
</div>

请参见https://jsfiddle.net/1r9Lu6y3/6/

希望这会有所帮助

顺便说一句：专辑很烂！

CSS显示：内联无法正常工作

1 个答案: