"Span"선택기가 작동하지 않습니다.

Question

내 H1 주변에 테두리를 만들려고하고 있는데 어떤 이유로 CSS에서 정확한 "span"을 선택할 수 없습니까? 내가 뭔가 잘못 쓰는거야?

HTML

h1 span { 
 
    
 
     display: inline-block; 
 
     padding: 0.5em 
 
     border: white solid 10px; 
 
    }

<header> 
 
    <div class="logo"> 
 
    <img src="octopus.png"> 
 
    </div> 
 

 
    <nav> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
    </nav> 
 
    <h1><span>Elias</span></h1> 
 
    <p class="kicker">Stuff // Other Stuff // More</p> 
 
</header>

Answer 1

당신이 border 작업하지 않습니다 padding 후 ;을 누락

h1 span { 
 
    display: inline-block; 
 
    padding: 0.5em; 
 
    border: white solid 10px; 
 
} 
 
/*demo*/ 
 

 
body { 
 
    background: lightblue 
 
}

<nav> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
    <a href="">One</a> 
 
</nav> 
 
<h1><span>Elias</span></h1> 
 
<p class="kicker">Stuff // Other Stuff // More</p>

이 질문에 더 이상 재현 할 수없는 문제 또는 간단한 인쇄상의 오류로 인해 발생되면서

Answer 2

CSS

span.classy { 
    background-color: DodgerBlue; 
} 

HTML

<span class="classy">Here's a span with some text.</span> 
<span>Here's another.</span>