Question

我想制作一个像5个产品的产品库，每个产品都有自己的background-image属性我使用循环来插入产品图像，所以我想让每个循环都有不同的背景图像

我正在考虑像这样使用IF语句

 <?php

 $bg = 0;
 $bg1 = "url('img1.jpg')";
 $bg2 = "url('img2.jpg')";
 $bg3 = "url('img3.jpg')";
 $bg4 = "url('img4.jpg')";
 $bg5 = "url('img5.jpg')";

 if ($bg = 0){ 
  echo " <div style='background-image :$bg1 ;'>" ;
      $bg = 1;
     } else if ($bg= 1) { 
       echo " <div style='background-image :$bg2 ;'>" ;
      $bg = 2;
     } else if ($bg= 2 ) { 
       echo " <div style='background-image :$bg3 ;'>" ;
      $bg = 3;
     } else if ($bg= 3 ) { 
       echo " <div style='background-image :$bg4 ;'>" ;
      $bg = 4;
     } else if ($bg= 4 ) { 
      echo " <div style='background-image :$bg5 ;'>" ;
       $bg = 0;
     }


    echo "   </div> " ;

    code for product images
?>

上面是我写的简化代码，它不起作用。如果有人有一个不同但更简单的解决方案，将不胜感激

注意：图像文件与此php文件位于同一目录中

谢谢

Answer 1

您是否愿意使用img标签？在我看来，这将是一个更好的解决方案：

代码：

<?php

$images=Array(
    "img1.jpg",
    "img2.jpg",
    "img3.jpg",
    "img4.jpg",
    "img5.jpg"
);

//
print "\n<br> Code: \n<pre>\n".RenderThoseImages($images)."\n</pre>";

//
function RenderThoseImages($images)
{
    //
    $s="";

    //
    foreach($images as $image){
        $s.="\n<div><img src=\"{$image}\"></div>";
    }

    return $s;
}

?>

输出：

<br> Code: 
<pre>

<div><img src="img1.jpg"></div>
<div><img src="img2.jpg"></div>
<div><img src="img3.jpg"></div>
<div><img src="img4.jpg"></div>
<div><img src="img5.jpg"></div>
</pre>

主要原因是当你使用背景图像CSS时，你还负责抓取PHP中的图像尺寸并将高度/宽度渲染到div CSS中，或者可能创建一些javascript来修复它加载，造成不必要的头痛。

将图像（背景图像CSS）制作成PHP变量值

1 个答案: