如何使用MySQL查詢中的行創建HTML表格佈局？

在我的「熱門標籤」頁面，我爲了獲取所有的標籤從這個PHP & SQL數據庫從最流行最不受歡迎：如何使用MySQL查詢中的行創建HTML表格佈局？

$sql = "SELECT t.tagid, t.name, t.desc, COUNT(qt.id) AS total 
     FROM tags t 
     LEFT JOIN question_tags qt ON t.tagid=qt.tag_id 
     GROUP BY t.tagid, t.name 
     ORDER BY total DESC"; 

$result = mysql_query($sql) or die(mysql_error()); 

while($row=mysql_fetch_assoc($result)) { 
    echo '<div class="tag-list-box" id="tag-'.$row['tagid'].'"> 
     <a href="/tags/'.strtolower($row['name']).'" class="tag"> 
     <span class="label label-inverse label-tag">'.strtolower($row['name']).'</span> 
     </a> <strong>&times; '.$row['total'].'</strong><br /> 
     <p>'.($row['desc']!==null ? $row['desc'] : '<em>This tag has no description.</em>').'</p> 
     </div>'; 
}

我沒有它在一個HTML現在因爲我認爲我可以用div和CSS來做更「現代的方式」，但正如你在下面的截圖中所看到的，當標籤有一個描述時，行會變得混亂，因爲盒子的高度大於其他：

enter image description here

我的箱子CSS是：

.tag-list-box { 
    width: 20%; 
    padding: 5px; 
    background-color: #f0f0f0; 
    border: 1px solid #ccc; 
    float: left; 
    margin-right: 2%; 
    margin-bottom: 10px; 
}

我想我應該把它放在這應該解決這個問題的表格，但我的問題是如何使從查詢每4行都有自己的<tr>所以每個表格行可以有4個？

我想不出來—我試着做了一個計數，並在while循環中增加它，但我不知道該從哪裏去。

來源

2012-06-15 Nathan

看起來有人試圖創造一個迷你SO，不是嗎？ – nickb

是的，我會檢查看看你是否有像斯科特說的連續4個，但是。你可以使用div。每4次之後，只需添加一個清除左側浮動的div。我不會使用一個設定的高度，因爲你永遠不知道物品有多高。我會做的例子：

$count = 0; 
while($row=mysql_fetch_assoc($result)) { 
    echo '...'; //YOUR CURRENT ECHO STATEMENT HERE 
    $count++; 
    if($count % 4 == 0) echo "<div style='clear: left;'></div>"; 
}

來源

2012-06-15 18:47:55 Pitchinnate

工作正常！謝謝。 :) – Nathan

4使用模運算符，看看你的數整除：如果你要保持你的CSS解決方案

if($count % 4 == 0)

，您還可以設置一個高度爲您的div，然後設置溢出隱藏處理太長的描述。

來源

2012-06-15 18:17:03

如果JS是一個選項，他也可以添加一個等高機制，這將是一個很好的補充（對我來說，比隱藏溢出的文本更好） –

哦，這很酷。謝謝。我會用這個。 – Nathan

@DamienPirsy我可以做到這一點（是的，JS是一種選擇），但我認爲描述不會那麼長。感謝您的想法，雖然:) – Nathan

如何使用MySQL查詢中的行創建HTML表格佈局？

回答

相關問題