Question

我在<a>中有一组<ul>按钮。由于一些jQuery问题，我没有在按钮周围使用任何<li>标签。现在我想使用.selected属性，但它似乎不起作用。

这是我的HTML：

<div class="sidepanel detailkat_tag_cloud">
             <h6 class="sidebar_header">Detailkategorien</h6>
             <div class="detailkatcloud" class="optionset" data-option-key="filter">                        
                 <ul class="optionset" data-option-key="filter">
                   <a href="#filter" data-option-value="*">Alle Anzeigen</a>
                   <a data-option-value=".dk1" href="#filter" title="">dk1</a>
                   <a data-option-value=".dk2" href="#filter" title="">dk2</a>
                   ...
                 </ul>
            </div>
            </div>      
   </div>

现在，如果我使用<li>标签，则以下CSS可以使用：

li.selected a { color: #00ff00; }

但是，我需要将此工作不带 <li>标记。我尝试了所有这些：

a.selected {}
ul.selected a {}
.detailkat_tag_cloud ul a.selected {}
.detailkatcloud ul a.selected {}
.optionset ul a.selected {} 
ul a.selected {}

但它们都不起作用。请帮忙！

Answer 1

CSS：

a.selected { color: #00ff00; }

HTML：

class="selected"

如果您还没有将课程添加到a，那么根据您的代码，您还没有。

<a href="#filter" data-option-value="*" class="selected">Alle Anzeigen</a>

或者，如果您只想悬停实现它。

a:hover.selected { color: #00ff00; }

或者如果您想为当前活动链接实现它。

a:active.selected { color: #00ff00; }

JSFiddle特定于您的问题。这是一种解决方法，因为您显然必须修改不同的页面。有办法避免这样做，但这需要一些JS，我今晚很累。这里：jsfiddle.net/uwoyvmf7

选择属性，没有＆＃34; list＆＃34;标签CSS

1 个答案: