2017-12-06 15 views
1

모든 기본 버튼의 텍스트 뒤에 글리프콘을 추가하고 싶습니다. 모든 버튼에 글리포콘 추가 (부트 스트랩 3.5)

는 여기 목록에서 glyphicon 포함시키는 방법을 발견 Using a Glyphicon as an LI bullet point

나는 버튼이 적용 시도를하지만 난 내가 좋아하는 추가 할 수 있습니다 실현 바로

.btn-default button:after { 
    content: "\e080"; 
    font-family: 'Glyphicons Halflings'; 
    font-size: 9px; 
    float: left; 
    margin-top: 4px; 
    margin-left: -17px; 
    color: #0099FF; 
} 

을 없어 이 :

<a class="btn btn-default" href="testpage.aspx"> 
    Learn more 
    <span class="glyphicon glyphicon-chevron-right"></span> 
</a> 

하지만 매번 추가하지 않아도됩니다. 나는 또한 색상을 설정하고 싶습니다.

<span class="glyphicon glyphicon-chevron-right"></span> 

다른 색상 단지 class을 추가하거나 selector를 사용하여 범위를 참조하고 CSS의 색상을 제공을 제공하려면 :

답변

1

Button Style with Gylph-icons

나는 당신이 수도 것은 당신의 모든 버튼에 이미지를 출력 이상 원한다. Class CSS의 텍스트 후 모든 기본 버튼에 적용 후 : 당신은 그냥 간단한 CSS를 작성할 필요가 들어

이미지와 같이

.btn-default:after { 
    content: "\e080"; 
    font-family: 'Glyphicons Halflings'; 
    font-size: 9px; 
    vertical-align: middle; 
    padding: 6px 5px; 
    color: #0099FF; 
} 

이 당신의 모든 버튼에 대한 작동합니다.

0

나는이 그 일을의 올바른 방법임을 잘 알고 있습니다.

.color-red { 
    color:#FF0000; 
}