У меня есть меню li, а текст по умолчанию - белый. Мне нужен один элемент этого элемента списка, чтобы иметь зеленый шрифт. Я создал специальный класс css, чтобы назначить цвет элемента списка зеленым, но он не работает. Я попытался установить стиль элемента, чтобы цвет был зеленым для шрифта, и это тоже не извращает. Любая помощь будет оценена! Вот код для элемента li.
<div id="navmenu">
<ul id="menu">
<li id="home" style="width: 10%; border-top-left-radius: 10px; background-color:#cdced0; color:Green"><a href="#">THINK GREEN</a></li>
<li id="flights" style="width: 10%; border-right: 2px solid white; border-top-right-radius: 10px" ><a href="#">YOUR STYLE</a></li>
<li id="events" style="width: 15%; border-right: 1px solid white; border-top-left-radius: 10px" ><a class="current" href="#">INSPIRATIONS</a></li>
</ul>
</div>
#menu
{
width:85%;
list-style:none;
margin:0;
padding:0;
margin:0;
text-decoration: none;
}
#menu li
{
margin:0;
background-color: #d2232a;
float:right;
padding-top: 10px;
}
#menu li a
{
display:block;
height: 25px;
font-weight: bold;
color: White;
text-align: center;
text-decoration: none;
font-family: helvetica;
}
#menu li a:hover
{
background-color: #94191c;
color: #fff;
font-weight: bold;
font-family: helvetica;
}
Вам нужно <a>
элемент <a>
, а не <li>
. Что-то вроде этого:
#menu #home a {
color:green;
}
Вот скрипка, я ничего не изменил, просто добавил CSS выше к вашему опубликованному коду: http://jsfiddle.net/VfJaG/
Проблема в том, что браузер имеет цвет по умолчанию для ссылок. Установив цвет в li, вы не применяете его к a. Поэтому вам нужно применить это
#home a {
color:#d2232a;
}