输出foreach PHP为两列表 - Output foreach PHP as two column table

Output foreach PHP as two column table

本文关键字：列表 PHP foreach 输出 | 更新日期: 2023-09-27

我试图让这个PHP在Woocommerce输出到一个表，而不是一个大列表。我尝试过HTML表标签，但它只把第一个"foreach"结果放在表中。

add_filter( 'woocommerce_product_tabs', 'woo_new_product_tab' );
function woo_new_product_tab( $tabs ) {
// Adds the new tab
$tabs['test_tab'] = array(
    'title'     => __( 'Amenities', 'woocommerce' ),
    'priority'  => 20,
    'callback'  => 'woo_new_product_tab_content'
);
return $tabs;
}
function woo_new_product_tab_content() {
// The new tab content
echo '<h2>Amenities</h2>';
echo '<h5>On-Site</h5>';
  $authorvalues = get_the_terms( $product->id, 'pa_onsite');
    echo '<ul>';
  foreach ( $authorvalues as $authorvalue ) {
   echo '<li>'.$authorvalue->name.'</li>';
    echo '</ul>';
        }
echo '<h5>Off-Site</h5>';
  $authorvalues = get_the_terms( $product->id, 'pa_offsite');
    echo '<ul>';
  foreach ( $authorvalues as $authorvalue ) {
   echo '<li>'.$authorvalue->name.'</li>';
    echo '</ul>';
        }
}

现在的结果是这样的:

<br/>Amenities<br/>
On-Site
<ul><li>Playground</li></ul>
Off-Site
<ul><li>Golf</li>
<li>Hiking</li>
<li>Outdoor pool</li>
<li>Skiing</li>
<li>Spa</li>
<li>Tennis</li></ul>

需要在两列。

html是一种描述文本语义的语言。表是用来存放适合在表中的数据的。你确实需要列表，但在不同的格式，尝试一些css

<!DOCTYPE html>
<html>
    <head>
    <title>TODO supply a title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        .container {
        float: left;
        margin-right: 30px;
        }
        .container ul{
        list-style: none;
        padding: 0;
        }
        .container li{
        border-top: 1px solid black;
        margin: 0;
        }
        .container li:first-child{
        border-top: 0;
        }
    </style>
    </head>
    <body>
    <h1>Amenities</h1>
    <div class="container">
        <h2>On-Site</h2>
        <ul>
        <li>Playground</li>
        </ul>
    </div>
    <div class="container">
        <h2>Off-Site</h2>
        <ul>
        <li>Golf</li>
        <li>Hiking</li>
        <li>Outdoor pool</li>
        <li>Skiing</li>
        <li>Spa</li>
        <li>Tennis</li>
        </ul>
    </div>
    </body>
</html>

我为.container添加了<style>，并将两个列表包装在<div>中，重要的是必须匹配样式的class="container"属性。有更好的方法来包含样式，但这是一个很好的开始。