2015-06-13 236 views
0

我的朋友爲我的桌子做了新的設計,但我不能將舊錶php代碼整合到新設計中。我怎樣才能做到這一點?謝謝我如何整合PHP到HTML表格

這是我的舊桌子;

<table align="center" width="1200" height="370" cellpadding="7"> 
       <tr> 
       <th>ID</th> 
       <th>Name</th> 
       <th>Sex</th> 
       <th>Country</th> 
       <th>Age</th> 
       <th>Twitter</th> 
       <th>Instagram</th> 
       <th>Snapchat</th> 
       <th>Details</th> 
      </tr> 

      <?php 
      foreach($db->query('SELECT * FROM uyeler ORDER BY RAND()LIMIT 20') as $row) { 
        echo "<tr><td>" .$row['id'] . "</td>"; 
        echo "<td>" .$row['fname'] . "</td>"; 
        echo "<td>" .$row['sex'] . "</td>"; 
        echo "<td>" .$row['country'] . "</td>"; 
        echo "<td>" .$row['age'] . "</td>"; 
        echo "<td>" .$row['twitter'] . "</td>"; 
        echo "<td>" .$row['instagram'] . "</td>"; 
        echo "<td>" .$row['snapchat'] . "</td>"; 
        echo ('<td><a href="details.php?id=' .$row['id'] . '" title="Panel">Details</a></td>'); 
        echo "</tr>"; 
       } 
      ?> 

      </table> 

這是全新的設計,(一行暗,一行黑色....)

<table class="table table-striped"> 

           <!--Table Header --> 
            <tr> 
             <th class="t_head">ID</th> 
             <th class="t_head">NAME</th> 
             <th class="t_head">SEX</th> 
             <th class="t_head">COUNTRY</th> 
             <th class="t_head">AGE</th> 
             <th class="t_head">TWITTER</th> 
             <th class="t_head">INSTERGRAM</th> 
             <th class="t_head">SNAPCHAT</th> 
             <th class="t_head">DETAILS</th> 
            </tr> 

           <!--Row 01 --> 
            <tr class="t_light"> 
             <td>14</td> 
             <td>Taha</td> 
             <td>Male</td> 
             <td>Russia</td> 
             <td>2000</td> 
             <td>Tahains</td> 
             <td>Male</td> 
             <td>Male</td> 
             <td><a href="#">Details</a></td> 
            </tr> 

           <!--Row 02 --> 
            <tr class="t_dark"> 
             <td>14</td> 
             <td>Taha</td> 
             <td>Male</td> 
             <td>Russia</td> 
             <td>2000</td> 
             <td>Tahains</td> 
             <td>Male</td> 
             <td>Male</td> 
             <td><a href="#">Details</a></td> 
            </tr> 

           <!--Row 03 --> 
            <tr class="t_light"> 
             <td>14</td> 
             <td>Taha</td> 
             <td>Male</td> 
             <td>Russia</td> 
             <td>2000</td> 
             <td>Tahains</td> 
             <td>Male</td> 
             <td>Male</td> 
             <td><a href="#">Details</a></td> 
            </tr> 

           <!--Row 04 --> 
            <tr class="t_dark"> 
             <td>14</td> 
             <td>Taha</td> 
             <td>Male</td> 
             <td>Russia</td> 
             <td>2000</td> 
             <td>Tahains</td> 
             <td>Male</td> 
             <td>Male</td> 
             <td><a href="#">Details</a></td> 
            </tr> 

           <!--Row 05 --> 
            <tr class="t_light"> 
             <td>14</td> 
             <td>Taha</td> 
             <td>Male</td> 
             <td>Russia</td> 
             <td>2000</td> 
             <td>Tahains</td> 
             <td>Male</td> 
             <td>Male</td> 
             <td><a href="#">Details</a></td> 
            </tr> 

           </table> 

CSS文件的一部分;

.table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th 
{ 
    background: #e0dfdf; 
} 

.table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td 
{ 
    background: #f7f7f7; 
} 

回答

1

可以按如下

<table align="center" width="1200" height="370" cellpadding="7"> 
    <tr> 
     <th class="t_head">ID</th> 
     <th class="t_head">NAME</th> 
     <th class="t_head">SEX</th> 
     <th class="t_head">COUNTRY</th> 
     <th class="t_head">AGE</th> 
     <th class="t_head">TWITTER</th> 
     <th class="t_head">INSTERGRAM</th> 
     <th class="t_head">SNAPCHAT</th> 
     <th class="t_head">DETAILS</th> 
    </tr> 
    <?php 
    $i=1; 
    foreach($db->query('SELECT * FROM uyeler ORDER BY RAND()LIMIT 20') as $row) { 
     if ($i%2!=0) 
      $class="t_light"; 
     else 
      $class="t_dark"; 
     echo "<tr class='".$class."'><td>" .$row['id'] . "</td>"; 
     echo "<td>" .$row['fname'] . "</td>"; 
     echo "<td>" .$row['sex'] . "</td>"; 
     echo "<td>" .$row['country'] . "</td>"; 
     echo "<td>" .$row['age'] . "</td>"; 
     echo "<td>" .$row['twitter'] . "</td>"; 
     echo "<td>" .$row['instagram'] . "</td>"; 
     echo "<td>" .$row['snapchat'] . "</td>"; 
     echo ('<td><a href="details.php?id=' .$row['id'] . '" title="Panel">Details</a></td>'); 
     echo "</tr>"; 
     $i++; 
    } 
    ?> 
</table> 

我做了什麼做到這一點的是,在每個循環我檢查裏面是否每個迭代的是wwhether奇數或偶數和正確應用類。

我認爲,您正在使用這樣的代碼以不同的方式設置不同的行。這可以通過CSS選擇器完成。無需爲rach行添加單獨的類。

在純CSS,你可以做到以下幾點:

//for even 
tr:nth-child(even) { 
    background-color: #000000; 
} 
//for odd 
tr:nth-child(odd) { 
    background-color: #FFFFFF; 
} 
+0

我想你的答案,但有一點​​「 $ row ['id']。「」;'但是所有的行都是白色的 – Can

+0

你錯過了一個''''應該是,'echo'​​「。$ row ['id']。 「」;' – Lal

+0

不,我試過了「但它的工作原理沒有」 – Can

0

那些樣的工作通過模運算%,幫助您獲得一個除法的餘數,通常完成。
在你的情況下,你可以找到偶數行和奇數行。

$a % $b Modulus Remainder of $a divided by $b.

來源:「在這條線上的錯誤它的工作原理與此`回聲 」http://php.net/en/language.operators.arithmetic

<?php 
    $i = 0; 
    foreach($db->query('SELECT * FROM uyeler ORDER BY RAND()LIMIT 20') as $row) { 
     echo '<tr class="'.($i%2 == 0 ? 't_light' : 't_dark').'">'; 
     echo "<td>" .$row['id'] . "</td>"; 
      // the other columns comes here 
     echo "</tr>"; 
     $i++; 
    } 
?> 
+0

不工作:(我檢查與PHP檢查代碼。它說「PHP語法檢查:解析錯誤:語法錯誤,意外」回聲「​​」。$ row ['id']。「」;' – Can

+0

@ Can ,現在應該工作。 –

+0

它的工作原理,但沒有設計和並排列出數據 – Can