programing

더 큰 글리폰

cafebook 2023. 9. 10. 12:39
반응형

더 큰 글리폰

트위터 부트스트랩 3.0(2.3.x가 아닌)에서 더 큰 글리폰을 만드는 방법.

이 코드를 사용하면 글리폰이 커집니다.

<button type="button" class="btn btn-default btn-lg">
   <span class="glyphicon glyphicon-th-list">
   </span>
</button>

스판만 사용하면서 btn-lg 클래스를 사용하지 않고 어떻게 이 사이즈를 받을 수 있나요?

이것은 작은 글리폰을 제공합니다.

<span class="glyphicon glyphicon-link"></span>

기호에 따라 글리피콘의 글꼴 크기를 지정할 수 있습니다.

span.glyphicon-link {
    font-size: 1.2em;
}

다음은 제가 하는 방법입니다.

<span style="font-size:1.5em;" class="glyphicon glyphicon-th-list"></span>

이를 통해 즉석에서 크기를 변경할 수 있습니다.CSS를 변경하여 모두에게 적용하는 것보다 크기를 변경하는 임시 요구 사항에 가장 적합합니다.

.btn-lg클래스는 부트스트랩 3(링크)에서 다음과 같은 CSS를 가집니다.

.btn-lg {
  padding: 10px 16px;
  font-size: 18px;
  line-height: 1.33;
  border-radius: 6px;
}

동일하게 적용하는 경우font-size그리고.line-height(또는) 당신이 할 수 있는 범위 내에서.glyphicon-link아니면 새로 창조된.glyphicons-lg이 효과를 둘 이상의 인스턴스에서 사용할 경우 큰 버튼과 동일한 크기의 글리폰이 표시됩니다.

<button class="btn btn-default glyphicon glyphicon-plus fa-2x" type="button">
</button>

<!--fa-2x , fa-3x , fa-4x ... -->
<button class="btn btn-default glyphicon glyphicon-plus fa-3x" type="button">
</button>

저 같은 경우에는.input-group-btn와 함께button, 그리고 이것을button컨테이너보다 조금 더 컸습니다그래서 그냥 줬습니다.font-size:95%내 글리폰 때문에 해결됐어요

<div class="input-group">
    <input type="text" class="form-control" id="pesquisarinbox" placeholder="Pesquisar na Caixa de Entrada">
    <div class="input-group-btn">
        <button class="btn btn-default" type="button">
            <span class="glyphicon glyphicon-search" style="font-size:95%;"></span>
        </button>
    </div>  
</div>

당신의 글을 쓰시오.<span>인에<h1>아니면<h2>:

<h1> <span class="glyphicon glyphicon-th-list"></span></h1>

부트스트랩 3을 사용하는 경우 태그를 사용합니다.<small><span class="glyphicon glyphicon-send"></span></small>부트스트랩 3에 적합합니다.
여러 개를 사용할 수도 있습니다.<small>크기를 더 작게 설정하는 태그.
코드:
<small><small><span class="glyphicon glyphicon-send"></span></small></small>

언급URL : https://stackoverflow.com/questions/18478365/bigger-glyphicons

반응형