Question

使用下面的代码，我创建了6个<div>，分为2列和3行，然后调用自定义函数writeMsg（），每个内容返回一个div 6 <div>，但输出有问题。

感谢您的帮助。

php code

  <?php
 function writeMsg() {
 $tab ="<div class='functiontest'>";
 echo "test";
 $tab .="</div>";
 return $tab;
 }
 $test = writeMsg();
  echo "<div class='wrapper'>";
   for( $i=0; $i < 6; $i++ ){
    echo "<div>" . $test . "</div>";
   }
  echo "</div>";
  ?>

CSS

  .functiontest{
    width:200px;
    height:200px;
    display:block;
    background-color:#F4F5BD;
    float:left;
   }
   .wrapper{
    background-color:#F7ABAC;
    display:block;
    width:1000px;
    min-height:1000px;
    float:none;
    clear:both;
    box-sizing:border-box;
    }
   .wrapper div{
    width:330px;
    height:300px;
    border:1px solid black;
    float:left;
    margin-left:7px;
    margin-bottom:10px;
    display: block;
    background:#cccccc;
    text-align: center;
    }
   .wrapper div:nth-child(2n+1){
    clear:left;
    }

Answer 1

  <?php
 function writeMsg() {
 $tab ="<div class='functiontest'>";
 $tab .= "test";
 $tab .="</div>";
 return $tab;
 }
 $test = writeMsg();
  echo "<div class='wrapper'>";
   for( $i=0; $i < 6; $i++ ){
    echo "<div>" . $test . "</div>";
   }
  echo "</div>";
  ?>

将css更改为

  <style>
    .wrapper div.functiontest{
    width:200px;
    height:200px;
    display:block;
    background-color:#F4F5BD;
    float:left;
   }
   .wrapper{
    background-color:#F7ABAC;
    display:block;
    width:1000px;
    min-height:1000px;
    float:none;
    clear:both;
    box-sizing:border-box;
    }
   .wrapper div{
    width:330px;
    height:300px;
    border:1px solid black;
    float:left;
    margin-left:7px;
    margin-bottom:10px;
    display: block;
    background:#cccccc;
    text-align: center;
    }
   .wrapper div:nth-child(2n+1){
    clear:left;
    }
  </style>

调用一个php自定义函数，在另一个<div>中返回一个<div>

1 个答案: