我怎样才能把这个css给特定的li类？

Question

I am trying to give the css bellow to a li or span class but i can't really. Can you help me with that?

.nav--icons ul li a.is-active {
  color: #fff;
  background-color: #000;
}
.nav--icons ul li a:hover span,
.nav--icons ul li a.is-active span {
  opacity: 1;
  max-width: 40px;
  transform: translate3d(0, 0, 0);
}

Or we can say i wan't that list item to be hover active as default. The code is that;

           <a class="selected1" href="#home">
            <svg class="icon icon-home" viewBox="0 0 24 24" width="24" height="24">
<path fill="currentColor" d="M21.6 8.2l-9-7c-0.4-0.3-0.9-0.3-1.2 0l-9 7c-0.3 0.2-0.4 0.5-0.4 0.8v11c0 1.7 1.3 3 3 3h14c1.7 0 3-1.3 3-3v-11c0-0.3-0.1-0.6-0.4-0.8zM14 21h-4v-8h4v8zM20 20c0 0.6-0.4 1-1 1h-3v-9c0-0.6-0.4-1-1-1h-6c-0.6 0-1 0.4-1 1v9h-3c-0.6 0-1-0.4-1-1v-10.5l8-6.2 8 6.2v10.5z"></path>
            </svg>
            <span class="selected2">Home</span>
          </a>
        </li>

Answer 1

If you want to give the style to every svg underneath a li selector and to every span underneath a li selector, you may write:

li svg, li span {
    color: #fff;
    background-color: #000;
}