Question

这个问题类似于创建备用颜色表行时，我们只处理div和margin而不是表行及其颜色。

以下代码创建的层数与从查询返回的类型一样多（如果找到三个类型，则创建三个层）;并且在创建的每个层中，代码创建的层数与该类型中的标题一样多（例如，如果每个类型有五个标题，则将有三个“genreName”层，并且每个层内将有五个“titleName” “图层”。

<cfoutput query="MyQuery" group="genreName">
    <div class="Genres">
        #MyQuery.GenreName#
        <cfoutput>
            <div class="Titles">
            #MyQuery.TitleName#
            <div>
        </cfoutput>
    </div>
</cfoutput>

这也意味着每个类中的所有层都是克隆。如果我有一个列布局，我不想为第一列/最后一列指定左/右边距，则此格式会中断。

是否有一种编程方式来根据图层编号（基本上是记录编号）分配边距，我可以在其中应用条件格式（在这种情况下，中间列的左右边距，没有左/右边距）第一页/最后一栏）？

非常感谢，

Answer 1

如果你真正想做的是在元素之间有一个固定的余量，但在第一个之前或之后没有，你可以使用{{3} }伪类来否决一般情况：

has_margin { margin-left: 20px; } column_container:first-child { margin-left: 0px; } ... <div class="column_container"> <div class="has_margin">...</div> <div class="has_margin">...</div> <div class="has_margin">...</div> <div class="has_margin">...</div> <div class="has_margin">...</div> </div>

CSS3定义了一个'结构伪选择器'，允许您选择每个first-child。将a设置为类克隆的数量允许您为每个图层定义许多规则。

Answer 2

是的，为左边（没有左边距），中间（有两个）和右边（没有右边）创建三个不同的类，或者你需要设置它。

接下来，跟踪一个计数器（在流派循环或标题循环中，取决于您对列的级别），并使用模数运算符指定正确的类。

<cfset titleCount = 1> <!--- reset your title count --->
<cfoutput>
   <cfswitch expression="#titleCount MOD 3#">
      <cfcase value="1"><cfset titleClass = "titleleft"></cfcase>
      <cfcase value="2"><cfset titleClass = "titlemiddle"></cfcase>
      <cfcase value="3"><cfset titleClass = "titleright"></cfcase>
      <cfdefaultcase><cfset titleClass = ""><!--- should never get here ---></cfdefaultcase>
   </cfswitch>
   <div class="#titleClass#">
      #MyQuery.TitleName#
   <div>
   <cfset titleCount = titleCount + 1>
</cfoutput>

关键是你需要保留自己的计数器，因为MyQuery.currentRow不会告诉你你在当前层的位置。

如何以编程方式格式化查询循环生成的图层？

2 个答案: