Question

我正在尝试在2x5表格中显示“遇见团队”页面，使用Wordpress中之前的网页设计师编写的代码。

这是我正在查看的页面 - http://www.stirling-house.com/about-us/meet-the-team正如我所说，我想在桌子上显示图片，所以它看起来更整洁。

我的代码是 -

<div id="maintext">
    <h1>MEET THE TEAM</h1>
    <h3>THE STIRLING HOUSE ADMINISTRATION TEAM</h3>
    <?php $members =get_posts('numberposts=99&cat=4&order=ASC'); //print_r($members); 
    foreach ($members as $post) {
    setup_postdata($post);?> 
    <div class="member-box">
        <img src="<?php echo get('member_photo');?>" alt="" style="margin:5px 7px 0 0;" />
        <h3><?php echo $post->post_title;?></h3>
        <h4><?php echo get('member_designation');?></h4>

有人可以帮忙吗？！

Answer 1

这样做的一种方法是在foreach之前添加一个计数器（例如，$n），将其初始化为零，并在每次循环结束时递增它。然后，让所有奇数div向左浮动，偶数浮动向右浮动。

这就是代码的样子（或多或少）：

<? 
$n = 0; // Counter
foreach($members as $post){
    if($n % 2) $style="float:left";
    else $style="float:right";

    <img src="<?php echo get('member_photo');?>" alt="" style="margin:5px 7px 0 0;" />
    <h3><?php echo $post->post_title;?></h3>
    <h4><?php echo get('member_designation');?></h4>

如果这不起作用，您可以尝试使用table布局并在$ n行后放置<tr>标记（每次添加<tr>时重置计数器）。< / p>

Answer 2

大多数网页设计师（2005年后左右）认为<table>元素不应用于布局/设计。如果您将以下CSS规则添加到您的网站，样式表：

.member-box { display: inline-block; }

您将获得如下内容：http://imgur.com/DzEkLAU

很抱歉间接回答，但我认为这是真正寻找的答案......;）

在基于表格的布局中显示PHP信息

2 个答案: