글꼴 사이에서 전환하기 호버상에서 굉장한 스타일

나는 주목받는 웹 디자이너이며, 도움이 필요한 문제가 있습니다. 나는 글꼴 Awesome에 아이콘을 달았습니다. 색상/스타일을 변경할 때 변경하고 싶습니다. 여기 글꼴 사이에서 전환하기 호버상에서 굉장한 스타일

내가 사용하려는 기본 스타일 :

CSS

.fa-circle { 
    color:red; 
}

HTML : 여기

<span class="fa-stack fa-5x"> 
    <i class="fa fa-circle fa-stack-2x"></i> 
    <i class="fa fa-arrow-right fa-stack-1x fa-inverse"></i> 
</span>

와 내가 원하는 무엇인가 마우스 오버시 전환 :

CSS

.fa-circle { 
    color:white; 
    border-color: red; 
    border-radius: 90px; 
    border-style: solid; 
} 

.fa-arrow-right { 
    color: red; 
}

HTML

<span class="fa-stack fa-5x"> 
    <i class="fa fa-circle fa-stack-2x"></i> 
    <i class="fa fa-arrow-right fa-stack-1x fa-inverse"></i> 
</span>

감사합니다,

애슐리

일반적인 이유 : 호버 CSS가 작동하지 않는이있는 <i> 그 태그는 서로 겹친다. 당신이 원 <i> 내부의 화살표 <i> 태그를 넣을 경우 작동합니다 :

당신은 화살표 (I이가 '배'클래스에서 가정)보다 두 배 큰 얻었다 것을 알하지 슈퍼 Font Awesome에 익숙하지만 쉽게 해결할 수 있습니다.

2016-06-06 22:01:16

답변