html - 一行文本/段落中的图像

Question

我正在尝试将一个图像插入到一个看起来像这个图像中的球的段落中:

.

如果重要的话，我正在使用 Bootstrap。

我一直在使用

<div class="col-md-8 col-xs 8">
    <h1><?php echo $config["First"]["Title"];?></h1>
    <p><?php echo $config["First"]["Text"];?></p>
    <?php echo '<img src="img/ball.png" class="img" style="
            float: right;
            position: relative;
    ">';?>
</div>

这是我一直想出来的，但它只是在文本下方，没有内联。

这是 p 标签的 CSS:

p {
    color: rgba( 180, 180, 180, 1 );
    position: relative;
    float: left;
}

Answer 1

你的 img 应该在你的 <p> 里面元素:

<p><img src="imgs/ball.png" class="img" />paragrag content goes here</p>

然后制作你的图像float:left;