表達式引擎＆CSS

我一直在使用Expression Engine學習。有一件事讓我陷入困境。表達式引擎＆CSS

我有一個使用四列網格的佈局（請參閱http://training.customstudio.co.uk/services）。這使用三個CSS類：一個用於列項目，一個用於最後一個列項目，另一個用於添加水平規則的行。我已經使用EE類的開關來創建列和列的最後一類，（見http://training.customstudio.co.uk/portfolio），但我不知道如何讓EE創建行類。我可以手動執行此操作，但希望頁面處於動態狀態，因此如果有16個項目，則會有4行，每行下面有行。

我使用的代碼如下：

<div class="content-main"> 
         <h1>Portfolio</h1> 
          {exp:channel:entries channel="portfolio" status="open|Featured" orderby="title" sort="asc"} 
          <div class="{switch='col|col|col|col-last'}"> 
           <h4><a href="{title_permalink='portfolio'}">{title}</a></h4> 
           <p>{project_description}</p> 
          </div><!-- /end #col --> 
          {/exp:channel:entries} 
        </div> 
<!-- /end #content-main -->

任何幫助將非常感謝！

由於提前，

湯姆·珀金斯

來源

2011-02-11 Tom Perkins

如果包裝在一個包含「行」 DIV每四個迭代switch語句的列div的，你應該讓你在找什麼：

   <div class="content-main"> 
        <h1>Portfolio</h1> 
         {exp:channel:entries channel="portfolio" status="open|Featured" orderby="title" sort="asc"} 
         {switch='<div class="row">|||'} 
         <div class="{switch='col|col|col|col-last'}"> 
          <h4><a href="{title_permalink='portfolio'}">{title}</a></h4> 
          <p>{project_description}</p> 
         </div><!-- /end #col --> 
         {switch='|||</div>'} 
         {/exp:channel:entries} 
       </div>

來源

2011-11-01 15:11:06 BellamyStudio

您也可以通過使用可返回第n項的模運算符來完成此操作。（https://ellislab.com/blog/entry/the-modulus-operator）

<div class="content-main"> 
    <h1>Portfolio</h1> 
     {exp:channel:entries channel="portfolio" status="open|Featured" orderby="title" sort="asc"} 
     {!-- Every 4th item add in a div with the class of row --} 
     {if count == 1 OR count % 4 == 1}<div class="row">{/if} 
     <div class="{switch='col|col|col|col-last'}"> 
      <h4><a href="{title_permalink='portfolio'}">{title}</a></h4> 
      <p>{project_description}</p> 
     </div><!-- /end #col --> 
     {if count % 5 == 0 OR count == total_results}</div>{/if} 
     {/exp:channel:entries} 
</div>

來源

2015-04-09 10:21:58

表達式引擎＆CSS

回答

相關問題