Если я установил цвет шрифта для стилей в моем неупорядоченном списке для моей панели навигации, как я могу преодолеть это с помощью.class на конкретном элементе?
Например, здесь моя навигация:
Главная
Сервисы
Около
Свяжитесь с нами
И поэтому я установил в своем CSS для цвета шрифта навигации № 000.
Теперь, что мне делать, если я хочу переместить только один из элементов, чтобы быть конкретным цветом с классом? Потому что я пытаюсь использовать класс на одном из них, но он не справляется с этим.
Если каждый из элементов находится под их собственным ли, вы можете установить один из этих li, как этот li class="home" Home li и в css поставить.home {color: # 000}, если я правильно прочитал вопрос, это должно помочь, если не извините, я новичок в этом. Корри, я бы написал его в коде, но все равно должен познакомиться с этим сайтом.
Вы можете использовать: active pseudo element.
Если ваш HTML-код:
<nav>
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="/services">Services</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
Вы можете сделать это с помощью CSS:
nav a {
color: #000;
font-size: 14px;
font-weight: 600;
}
nav a:hover {
color: #3e82f7;
}
nav a:active {
color: #db4437;
}
nav a:visited {
color: #ffeb3b;
}
Если вы пытаетесь указать, на какой странице находится пользователь, вы, вероятно, захотите структурировать свой HTML по этим строкам:
<nav>
<ul>
<li><a class="current-page" href="home.html">Home</a></li>
<li><a href="/services">Services</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</nav>
И ваш CSS:
nav a {
color: #000;
font-size: 14px;
font-weight: 600;
}
.current-page {
color: #3e82f7;
}