根据变量在图标周围创建边框

时间:2020-09-28 13:36:32

标签: php html css

What i currently have

what im trying to make

当我抛出例如2和3时,我需要它,它下降2并使用黑色边框从左到右标记它,然后它向右3并使用黑色边框从上到下标记在该点他们越过我需要它是红色边框。

<html lang="en" dir="ltr">
<head>
  <meta charset="utf-8">
  <title></title>
  <link rel="stylesheet" href="form.css">
</head>
<body>
  <div class="wrapper">
  <?php
  if(isset($_POST['submit'])) {
  $dice1 = mt_rand(1,6);
  $dice2 = mt_rand(1,6);

  echo "<table class='table'>";
  for ($i=0; $i < 6 ; $i++) {
    echo "<tr>";
    for ($j=0; $j < 6 ; $j++) {
      echo "<td> <img class='icon cell color".mt_rand(1,4)."' src='img/icon".mt_rand(1,4).".svg ' </td>";
    }
    echo "</tr>";
  }
  echo "</table>";
  echo "<img class='dice1' src='img/dice".$dice1.".gif'>";
  echo "<img class='dice2' src='img/dice".$dice2.".gif'>";
}
   ?>
   <form method="get" action="/php1/eindopdracht/cal.php">
    <button type="submit" class="button1">renew</button>
</form>
   <form method="POST">
     <button type='submit' class='button2' name='submit' value='submit'>throw</button>
   </form>
</div>
 </body>
 </html>```


2 个答案:

答案 0 :(得分:1)

您可以检查dice1值是否等于$ i,您可以添加某个使黑色为黑色的类。如果dice2值等于$ i,则相同。如果那么dice1等于$ i且dice2值等于$ j,请选择其他类别以使边框变为红色。

function chooseBorder($i,$j,$dice1,$dice2) {
    $class = "";
    if ($dice1 == $i && $dice2 == $j) {
        $class = "border-red";
        return $class;
    }

    if ($dice1 == $i || $dice2 == $j) {
        $class = "border-black";
        return $class;
    }

    return $class;
}


for ($i=0; $i < 6 ; $i++) {
    echo "<tr>";
    for ($j=0; $j < 6 ; $j++) {
        $class = chooseBorder($i,$j,$dice1,$dice2);
        echo "<td> <img class='icon cell color".mt_rand(1,4). " " . $class . "' src='img/icon".mt_rand(1,4).".svg ' </td>";
    }
    echo "</tr>";
}

答案 1 :(得分:0)

<html lang="en" dir="ltr">
 <head>
   <meta charset="utf-8">
   <title></title>
   <link rel="stylesheet" href="form.css">
 </head>
 <body>
   <div class="wrapper">
   <?php
   if(isset($_POST['submit'])) {
   $dice1 = mt_rand(1,6);
   $dice2 = mt_rand(1,6);

   function chooseBorder($i,$j,$dice1,$dice2) {
       $class = "";
       if ($dice1 == $i && $dice2 == $j) {
           $class = "border-red";
           return $class;
       }

       if ($dice1 == $i || $dice2 == $j) {
           $class = "border-black";
           return $class;
       }
       return $class;
   }
   for ($i=1; $i < 7; $i++) {
       echo "<tr>";
       for ($j=1; $j < 7 ; $j++) {
           $class = chooseBorder($i,$j,$dice1,$dice2);
           echo "<td> <img class='icon cell color".mt_rand(1,4). " " . $class . "' src='img/icon".mt_rand(1,4).".svg ' </td>";
       }
       echo "</tr>";
   }
echo "</table>";
echo "<img class='dice1' src='img/dice".$dice1.".gif'>";
echo "<img class='dice2' src='img/dice".$dice2.".gif'>";

}
    ?>
    <form method="get" action="/php1/eindopdracht/cal.php">
     <button type="submit" class="button1">renew</button>
 </form>
    <form method="POST">
      <button type='submit' class='button2' name='submit' value='submit'>throw</button>
    </form>
</div>
  </body>
  </html>
相关问题