2013-04-12 5 views
1

Вот пример на jsfiddle: http://jsfiddle.net/v6kuL/Как мне настроить параметры моего меню?

Как изменить Категории1, Категория2, Категория3 на другие цвета?

HTML:

<ul> 
    <li> 
     <a href="/category/category1">Category 1</a> 
     <ul class="children"> 
     <a href="/category/" > 
      <li> 
     <a href="/category/category1a">Category 1 A</a> 
     </li> 
     </a> 
     </ul> 
    </li> 
    <li> 
     <a href="/category/category2">Category 2</a> 
    </li> 
    <li> 
     <a href="/category/category3">Category 3</a> 
     <ul class="children"> 
     <a href="/category/" > 
      <li> 
     <a href="/category/category3a">Category 3 A</a> 
     </li> 
     <li> 
      <a href="/category/category3b">Category 3 B</a> 
     </li> 
     </a> 
     </ul> 
    </li> 
</ul> 

Моя попытка на jsfiddle связаны выше.

ответ

0

Вы можете использовать:

ul:not(.children) > li > a:first-child { 
    color: red; 
} 

Updated Demo

2

Создайте классы с цветами, которые вы хотите использовать, и примените их к тегам <a>.

<a href="/category/category1" class="red">Category 1</a> 
<a href="/category/category1a" class="black">Category 1 A</a> 

Создать <style> тег в заголовке HTML, а также добавлять классы в теге.

.red{color:red;} 
.black{color:black;} 

В дополнение к цвета, как красный и черный, вы можете применить любой цвет в формате RGB, как это: color: #FFCC00;

+0

Я отредактировал ваш ответ, чтобы дать немного больше информации и немного лучшего объяснения того, как это сделать. Не стесняйтесь возвращаться, если хотите. – Jeff

+0

да, это лучше, спасибо. –

0

Я только что добавил это в начале CSS

li a{color:red;} 
.children a{color:blue;} 

Таким образом, родитель красный, а ребенок синий. Приветствия.

Смежные вопросы