2013-04-12 3 views
7

나는 사회적 사이트 아이콘이 회색입니다. 내가 그 (것)들 위에 마우스를 가져갈 때, 나는 그 (것)들을 적합한 색깔 (facebook에 바꾸는 원한다 : 파랑, google + : 빨강, 등등). 나는 그걸로 놀았 어. 아무 소용이 없어.글꼴 굉장 호버 효과를 어떻게 추가합니까?

<li style="float:left;"> 
     <!-- start social bookmarks --> 
     <div style="font-size: 32px; color: grey;"> 
     <i class="icon-facebook-sign" style="margin-left: 0px;"></i> 
     <i class="icon-twitter-sign" style="margin-left: -12px;"></i> 
     <i class="icon-linkedin-sign" style="margin-left: -12px;"></i> 
     <i class="icon-google-plus-sign" style="margin-left: -12px;"></i> 
     </div> 
     <!-- end social bookmarks --> 
    </li> 
+0

CSS를 게시 할 수 있습니까? – kamalo

+0

관련 : http://stackoverflow.com/questions/13233991/combine-after-with-hover – xeo

답변

3

당신은 당신이 사용할 수있는이

.icon-facebook-sign:hover 
{ 
    background-color:blue; 
} 
+1

까다로운 부분은 실제로는 텍스트이기 때문에 색상 대 배경색이어야한다는 것입니다. – Fernker

5

뭔가를 시도 할 수 있습니다 : 여기 코드는 이미 기본을 가지고 있다는 사실을 바탕으로

.icon-facebook-sign:hover{color:lightblue;} 
    .icon-twitter-sign:hover{color:yellow} 

http://jsbin.com/opeyoy/1/

2

색상, 당신은 페이스 북, 구글 플러스 및 트위터에 대한이 세 가지를 사용할 수 있습니다 :

.icon-facebook-sign:hover { 
    color: rgba(59, 89, 152, .7); 
    } 

    .icon-twitter-sign:hover { 
    color: rgba(0, 172, 237, .7); 
    } 

    .icon-google-plus-sign:hover { 
    color: rgba(172, 0, 0, .7); 
    }