在我的“流行标签”页面上,我使用PHP & SQL从数据库中提取所有标签,从最流行到最不流行:
$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>× '.$row['total'].'</strong><br />
<p>'.($row['desc']!==null ? $row['desc'] : '<em>This tag has no description.</em>').'</p>
</div>';
}
我现在没有在HTML表中使用它,因为我认为我可以用div和CSS以更“现代的方式”完成它,但正如您在下面的屏幕截图中看到的那样,当一个标记有一个描述时,行就会变得混乱,因为框的高度比其他的要大:
我对盒子的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-16 02:47:55
是的,我会检查一下你是否像斯科特说的那样连续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-16 02:17:04
使用模运算符查看计数是否能被4整除:
if($count % 4 == 0)
如果您想保留css解决方案,还可以为div设置一个高度,然后将overflow设置为hidden,以处理过长的描述。
https://stackoverflow.com/questions/11056100
复制相似问题