@alias337

Как выделить кнопку?

Суть такая делаю кнопки для переключения между страницами.Надо чтоб кнопка выделялась когда я нахожусь на странице чтобы обозначить на какой именно странице я нахожусь.
есть такой код в html.
<nav class="dws-menu">
            <ul>
              <li><a href="menu.html"><i class="fa fa-"></i><<</a></li>
              <li><a href="menu.html"><i class="fa fa-"></i>1</a></li>
              <li><a href="menu2.html"><i class="fa fa-"></i>2</a></li>
              <li><a href="menu3.html"><i class="fa fa-"></i>3</a></li>
              <li><a href="menu4.html"><i class="fa fa-"></i>4</a></li>
              <li><a href="menu2.html"><i class="fa fa-"></i>>></a></li>
            </ul>
            </nav>

и такой в css.
.dws-menu *{
	margin: 0;
	padding: 0;
}
.dws-menu ul,
.dws-menu ol{
	list-style: none;
}
.dws-menu > ul{
    display: flex;
    justify-content: center;
}
.dws-menu > ul li a{
	display: block;
	margin: 2px;
	background:rgba(92,92,94,.6);
	padding: 5px 25px 5px 25px;
	font-size: 14px;
	color:#454547;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 18px;
	border: 1px solid black;
	color: black;
	transition: all 0.3s ease;
	border-radius: 2px;
}
.dws-menu >ul li a:hover{
	background: rgba(54,54,54);
}


Заранее Спасибо за внимание.
  • Вопрос задан
  • 122 просмотра
Решения вопроса 1
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
https://jsfiddle.net/cvhtzm1e/ Это вариант с добавлением класса.

Умнее убирать href у ссылки, которая не должна быть ссылкой. И использовать селекторы атрибутов и :not. https://habr.com/post/85920/

вот так: https://jsfiddle.net/h4yqwLmt/
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы