Question

我正在为我的Web开发课程做练习，但我遇到了麻烦。这是问题所在： -我有一个选择菜单。当用户选择“音乐”时，我想向他展示三个，每个包含一个具有背景图像CSS适当性的图像。图像必须存储在php数组中。当用户选择“运动”或“剧院”时，也会发生同样的情况。

问题是，当我尝试显示存储在数组中的图像时，只能看到书面链接（例如“ www.pexels.com”），而不能看到图像本身。

如果有人可以帮助我，将不胜感激，谢谢！

代码如下：

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <title>Devoir 1 de php</title>
  </head>

  <body>

    <h1>Catégorie:</h1>


      <?php
        include "data.php";

        if (isset($_POST['submit']))
        {

         switch($_POST["activite"])
         {
            case 'musique':
            $image1 = $musique['imageMusique1'];
            $image2 = $musique['imageMusique2'];
            $image3 = $musique['imageMusique1'];
            break;

            case 'théâtre';
            echo "théâtre";
            break;

            case 'sport':
            echo "Sport";
            break;
          }

        }
      ?>

    <form method="post" action="">
      <select name="activite" >
        <option value="musique">Musique</option>
        <option value="théâtre">Théâtre</option>
        <option value="sport">Sport</option>
      </select>
      <input type="submit" value="voir photos" name="submit">
    </form>


    <div style = "background-image: url('<?php echo $image1 ?>')"></div>
    <div style = "background-image: url(<?php echo $image2 ?>)"></div>
    <div style = "background-image: url(<?php echo $image3 ?>)"></div>



  </body>
</html>

这是存储数组的页面的代码（在练习中必须分开）。

<?php

$musique = array('imageMusique1' => 'image_musique1.jpg' , 'imageMusique2' => '../images/images_theatre/image_musique2.jpg', 'imageMusique3' => '../images/images_theatre/image_musique3.jpg' );
$theatre = array('imageTheatre1' => '' , 'imageTheatre2' => '', 'imageTheatre3' => '' );
$sport = array('imageSport1' => '' , 'imageSport2' => '', 'imageSport3' => '' );


echo $musique['imageMusique1'];


?>

Answer 1

您的div没有空间显示图像。

例如，设置宽度和高度并尝试：

<div style = "background-image: url('<?php echo $image1 ?>'); width:100px;height:100px"></div>

当然，div的大小必须符合您的期望。

或者，您也可以使用<img />。

显示存储在数组（php）中的图像

1 个答案: