動態CSS類屬性？

我有一個導航欄，其元素使用的Struts2呈現iterator標籤象下面這樣：動態CSS類屬性？

<ul> 
    <li><a href="#">Home</a></li> 

<s:iterator var="row" value="#session.PrivMenu.children" status="stat">   
    <li> 
     <a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>"> 
      <s:property value="#row.moduleName"/> 
     </a> 
    </li> 
</s:iterator> 

</ul>

現在我必須與每個<a>元件施加圖標。由於每個導航欄元素的圖標都會有所不同，因此每個<a>標籤都需要不同的樣式。

我怎麼能在struts2中實現這個？

我想到了動態cssClass屬性。

cssClass = '<s:property value="#row.moduleName"/>' + icon

但是我後來覺得如果模塊名稱發生變化，我將不得不編輯我的css。我會錯嗎？有什麼更好的想法

來源

2014-04-30 Siddharth Trikha

從你想要的HTML內容的HTML .... –

由迭代器標記呈現的錨定標記。 –

問題被誤解了。爲什麼模塊名最終會改變名稱？它是不同名稱的相同模塊嗎？它會成爲一個新模塊嗎？模塊的數量永遠不會改變？戰爭中的圖像還是存儲在外部？戰爭中的CSS還是外部存儲的？等等...請澄清您的問題，以獲得更好的幫助 –

你可以給它添加一個類，然後用css添加一個圖標。在你的CSS中，你可以使用'n-child'選擇器爲每個標籤添加不同的圖標。

請參閱：w3schools.com/cssref/sel_nth-child.asp瞭解更多信息。

使用選擇器可以爲每個標籤設置背景。例如：如果你有7個環節，並要設置第五背景使用：

.MyNavBar a:nth-child(7n+5) {width: 50px;background-image:url('MyImageurl');}

來源

2014-04-30 06:24:51 Thor

如果你想與第n個孩子的工作，它不工作像IE8以下瀏覽器。另一種可能性（如果菜單結構不改變）在li上使用一個帶有計數器的獨特類。

然後用正確的CSS來設計菜單

如果您在使用，你可以用一個計數器的possibilty是這樣的：

<ul> 
    <li class="menu-1"><a href="#">Home</a></li> 
    <s:iterator var="row" value="#session.PrivMenu.children" status="stat"> 
    <li class="menu-2"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>"> 
     <s:property value="#row.moduleName"/></a> 
    </li>      
    </s:iterator> 
    <s:iterator var="row" value="#session.PrivMenu.children" status="stat"> 
    <li class="menu-3"><a href="#" rel="ddsubmenu<s:property value="#stat.index+1"/>"> 
     <s:property value="#row.moduleName"/></a> 
    </li>      
    </s:iterator>  
</ul>

來源

2014-04-30 06:32:50 d1m5n

動態CSS類屬性？

回答

相關問題