Я не могу понять, почему мой стиль CSS мешает друг другу? - PullRequest
Новая
       40

Я не могу понять, почему мой стиль CSS мешает друг другу?

0 голосов
/ 08 октября 2019

Что ж, я пытаюсь стилизовать ссылки, но это влияет и на мою навигацию.

Я пытался расположить их по-разному, но блок, который пишется позже, похоже, влияет. 

/*---navbar---*/
  .main-nav li a:link,a:visited{
    padding:8px 0;
    color:white;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 90%;
    border-bottom: transparent;
    transition: border-bottom 0.3s;
 }
.main-nav li a:hover,a:active{
    border-bottom: 2px solid #e58e26;

}

/*---links---*/
a:link,
a:visited {
    color: #e67e22;
    text-decoration: none;
    padding-bottom: 1px;
    border-bottom: 1px solid #e67e22;

    transition: border-bottom 0.2s, color 0.2s;
}

a:hover,
a:active {
    color: #555;
    border-bottom: 1px solid transparent;
}

Ответы [ 2 ]

1 голос
/ 08 октября 2019

Вот ваша проблема: 

.main-nav li a:link,a:visited{
   /* style rules */
}
.main-nav li a:hover,a:active{
   /* style rules */
}

Каждый селектор, разделенный запятыми, должен быть записан полностью: 

.main-nav li a:link, .main-nav li a:visited{
   /* style rules */
}
.main-nav li a:hover, .main-nav li a:active{
   /* style rules */
}
0 голосов
/ 08 октября 2019

Это не будет работать: 

.main-nav li a:link,a:visited {
  /* style*/
}
.main-nav li a:hover,a:active {
  /* style*/
}

В CSS вы не можете писать такие свойства.

Вместо этого вам нужно написать .main-nav li a:hover, main-nav li a:active.

...