动态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类属性？

回答

相关问题