Question

我正在运行一个获取信息的foreach，然后该值用于设置图像的高点（条形图）。

我试图在栏上方的文字中添加值，但是在栏旁边并排不断。有任何想法吗？请记住，这是在foreach内完成的，因此有10个值，包含10个图像。

代码：

<?php echo "$textvalue"; ?>

<img src="images/bar_offpeak.jpg" alt="" width="19" height="<?php echo "$height" ?>%" title="<?php echo "$textvalue" ?>GB" />

Answer 1

您需要在文本后添加<br />元素。默认情况下，简单的文本和图像会浮动。

这是你想要做的：

<?php echo "$textvalue"; ?><br />

<img src="images/bar_offpeak.jpg" alt="" width="19" height="<?php echo "$height" ?>%" title="<?php echo "$textvalue" ?>GB" />

稍后编辑：

我的错误先生，我似乎已经忘记了这一部分。在这种情况下，一种解决方案是在div元素中显示每个图像和文本。这样，您可以以任何方式浮动div（即显示您想要的任意数量的行/列）。

所以，有一个项目是这样的：

<div style="float:left;">
    <?php echo "$textvalue"; ?><br />

    <img src="images/bar_offpeak.jpg" alt="" width="19" height="<?php echo "$height" ?>%" title="<?php echo "$textvalue" ?>GB" />
</div>

无论何时你想创建一个新行，只需插入一个这样的div：

<div style="clear:both;"></div>

这应该是一个让你走上正确道路的好主意。但是，正如Jeroen建议的那样，你应该采用更加面向布局的方法。

希望这会有所帮助。祝你有个美好的一天：

Answer 2

我不会使用<br>标记来操纵布局。我建议将文本放在一个元素（span，figcaption等）中，并使用css来控制布局。

假设html5：

<figure>
  <figcaption><?php echo $textvalue; ?></figcaption>
  <img src="images/bar_offpeak.jpg" alt="" width="19" height="<?php echo $height ?>%" title="<?php echo $textvalue ?>GB" />
</figure>

在css中（仅举例）：

figcaption {
  display: block;
}

PHP文本在图像foreach

2 个答案: