从PHP循环输出正确的HTML的最佳方法是什么?

问题描述 投票:1回答:4

我有一个问题,我有一个HTML问题,我不知道我是否使用最好的方法,所以这是我的问题:Everthing是好的:http://screencast.com/t/uJmffaxE 如果我有更多的空间,这里开始出现问题:http://screencast.com/t/1z1GRhOLK 这是我的代码:

<div id="wrap-categories" class="clearfix">
<?php if($this->categories !== false): ?>
    <ul>
    <?php foreach($this->categories as $category):?>
        <li>
            <strong><?=$category['name']?></strong><br />
        <?php if($this->artistsHelper($category['id']) !== false): ?>
            <?php foreach($this->artistsHelper($category['id']) as $artist): ?>
                <p><?=$artist['name']?></p>
            <?php endforeach; ?>    
        <?php endif; ?>
        </li>   
    <?php endforeach; ?>
    </ul>
<?php endif; ?>

以下是生成时标记的外观:

            <div id="wrap-categories" class="clearfix">

                                <ul>
                                        <li>
                        <strong>Dj's</strong><br />
                                                                                <p>Big artists</p>
                                                        <p>asddssdadsasda</p>
                                                        <p>Gigle bossu</p>

                                            </li>   
                                        <li>

                        <strong>Make up</strong><br />
                                                                                <p>Cool</p>

                                            </li>   
                                        <li>
                        <strong>Mamam</strong><br />
                                            </li>   
                                        <li>
                        <strong>Tata</strong><br />

                                            </li>   
                                        <li>
                        <strong>Dawaj</strong><br />
                                            </li>   
                                        <li>
                        <strong>Sexy</strong><br />
                                            </li>   
                                        <li>
                        <strong>Bitch</strong><br />

                                            </li>   
                                        <li>
                        <strong>Armin</strong><br />
                                            </li>   
                                        <li>
                        <strong>Lol</strong><br />
                                            </li>   
                                        <li>
                        <strong>Gogu</strong><br />

                                            </li>   
                                        <li>
                        <strong>Penal</strong><br />
                                            </li>   
                                        <li>
                        <strong>Asasin</strong><br />
                                            </li>   
                                    </ul>
                        </div>

css

#wrap-categories ul li{
float:left;
margin-right:10px;
}

请帮忙吗?!

php html css zend-framework
4个回答
1
投票
 <?php $x = 1?>         
 <?php if($this->categories !== false): ?>
    <?php foreach($this->categories as $category):?>
        <div class="column" <?=($x == 6) ? "style=\"clear:left\"" : false;?>>
            <ul>
                <li class="category"><?=$category['name']?></li> <!-- header data... -->
            <?php if($this->artistsHelper($category['id']) !== false): ?>
                    <?php foreach($this->artistsHelper($category['id']) as $artist): ?>
                            <li><?=$artist['name']?></li> <!-- no class info here because its just text -->
                    <?php endforeach; ?>    
            <?php endif; ?>
            </ul>
            <?php ($x == 6) ? $x = 1 : $x++;?>
         </div>   
    <?php endforeach; ?>
<?php endif; ?>

2
投票

有几个问题需要解决。首先,UL代表无序列表,如果您拥有的只是第一列数据,那么它就很棒。我只能假设您需要填写更多的数据列(横跨水平轴),因此UL是错误的父标记。如果是正确的标记,则需要附加开始和结束LI(对于列表项)标记。

@Jonathan Sampson的评论是正确的。你会在网上和其他地方看到很多帖子,说明邪恶的表是怎样的,当被误用于布局时也是如此。 根据您向我们展示的内容,您有表格数据,并且应该使用Table标记作为父标记。

更新

我似乎误解了你的数据的性质。来回走动后,这是您的解决方案:

<style type="text/css">

     .column
     {
          float: left;
          display: inline;
          clear: none;
          margin: 0 5px;
     }

     .column UL LI 
     {
          list-style: none;
     }


     .category
     {
         font-weight: bold;
     }
 </style>

 <div> <!-- this is an outer/wrapper/container -->
 <?php if($this->categories !== false): ?>
    <?php foreach($this->categories as $category):?>
        <div class="column">
            <ul>
                <li class="category"><?=$category['name']?></li> <!-- header data... -->
            <?php if($this->artistsHelper($category['id']) !== false): ?>
                    <?php foreach($this->artistsHelper($category['id']) as $artist): ?>
                            <li><?=$artist['name']?></li> <!-- no class info here because its just text -->
                    <?php endforeach; ?>    
            <?php endif; ?>
            </ul>
         </div>   
    <?php endforeach; ?>
    </div>

我在这里发布的内容与您开始时的内容存在一些差异:

  • 将每列包裹在浮动DIV中
  • 将每个“艺术家”包裹在一对LI中
  • 将整个东西包裹在容器DIV中
  • 在样式表中设置标题行的外观

0
投票

我认为你必须使用样式表(css)来使它工作。尝试在列表中添加固定宽度。


0
投票

如果我理解正确你的问题是源代码缩进。这是对的吗? Here will be your answer。当我使用Netbeans IDE的源代码 - >格式选项时,我遇到了这个问题:

        <div class="for">
            <?php for ($i = 0; $i < 10; $i++): ?>
<p> <!-- this "p" without indentation will be correct rendered -->
paragraph
            </p> <!-- this one will always render wrongly -->
           <?php endfor; ?>

但是如果使用源代码 - >格式选项或自己缩进它将使用额外的缩进进行渲染。使用print或echo它没有出错。

© www.soinside.com 2019 - 2024. All rights reserved.