왜 자동 초점이 단추 주위에 점선으로 표시됩니까?

Question

버튼 그룹이 있는데 페이지가로드 될 때 활성화 된 첫 번째 버튼을 설정하려고합니다. .active를 사용하지 않는 이유는 다른 버튼을 누르면 활성 상태가 첫 번째 버튼에 남아 있기 때문에 JS를 사용하여 버튼의 상태를 변경해야하기 때문입니다. 그래서 저는 오토 포커스를 속성으로 사용하고 있습니다. 이렇게

<div id="resultOption" class="btn-group btn-group-lg" role="group" aria-label="..."> 
       <button type="button" class="btn btn-default" autofocus>Events</button> 
       <button type="button" class="btn btn-default">Hosts</button> 
       <button type="button" class="btn btn-default">Teachers</button> 
      </div> 

하지만 페이지를로드 할 때이이

I 버튼 또는 멀리가는 또 다른 버튼을 클릭하면 같은 버튼 주위에 이상한 점선이지만, 나쁜보고 나는이 이상한 점선을 원하지 않는다. 내가

Answer 1

IE 11을 사용하고

0 또는 none에 CSS의 개요 속성을 설정하십시오.

예 :

:focus { outline: none; }