정렬 아이콘이 있는 부트스트랩 테이블을 표시하는 방법

부트 스트랩을 처음 사용하는데 테이블 제목 근처에 정렬 위쪽 및 아래쪽 화살표가있는 테이블을 표시해야하는 요구 사항이 있습니다. 내 테이블 구조는 다음과 같습니다.

<table class="table table-bordered table-striped">
        <thead>
        <tr>
            <th><b>#</b>  <i class='icon-arrow-up'></i><i class='icon-arrow-down'></th> **// tried** 
            <th ><b>Name</b></th>
            <th><b>Email</b></th>
            <th><b>Team</b></th>
            <th ><b>Role</b></th>
            <th ><b>Timezone</b></th>
            <th><b>Connections</b></th>
            <th><b># Posts available</b></th>
            <th><b>Last Login</b></th>
            <th><b>Posts</b></th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>

다음 이미지와 유사한 정렬 위/아래 화살표를 표시하고 싶습니다.

이 문제를 해결할 수 있도록 도와주세요. 도와주시면 대단히 감사하겠습니다. 감사합니다.

Dibish
편집된 질문5일 8월 2014 в 4:49
프로그래밍
twitter-bootstrap-3 twitter-bootstrap
5일 8월 2014 в 4:41
22 파운드
질문에 대한 의견 (2)
해결책

폰트어썸**을 사용해 볼 수 있습니다. 여기에는 정렬 아이콘(http://fontawesome.io/icon/sort/)이 포함되어 있습니다.

이렇게 하려면 다음과 같이 하세요.

  1. 폰트어썸을 포함해야 합니다:

  2. 그런 다음 '세 번째'에 기본 부트스트랩 아이콘 대신 fontawesome 아이콘을 사용하기만 하면 됩니다:

     <th># </th>

도움이 되었기를 바랍니다.

nozzleman
편집된 답변5일 8월 2014 в 9:08
해설 (4)

부트스트랩(글리피콘)과 함께 이 아이콘을 사용하세요:

<span class="glyphicon glyphicon-triangle-bottom"></span>
<span class="glyphicon glyphicon-triangle-top"></span>

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_glyph_triangle-bottom&stacked=h

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_glyph_triangle-bottom&stacked=h

Dudi
편집된 답변19일 9월 2016 в 6:56
해설 (5)

위/아래 화살표만 표시해야 하는 경우 해결책이 있습니다. 화살표가 작동하도록 하려면 이 부트스트랩 테이블을 사용하면 됩니다.

Tudor
편집된 답변29일 3월 2017 в 2:33
해설 (0)