bootstrap_table

• bootstrap에서 제공하는 테이블 속성

 

<기본 테이블>

<table class="table">
            <tr>
                <th>번호</th>
                <th>제목</th>
                <th>글쓴이</th>
            </tr>
            <tr>
                <td>1</td>
                <td>테이블 테스트</td>
                <td>김뉴림</td>
            </tr>
            <tr>
                <td>2</td>
                <td>테이블 테스트</td>
                <td>또롱이</td>
            </tr>
            <tr>
                <td>3</td>
                <td>테이블 테스트</td>
                <td>나무늘보</td>
            </tr>
        </table>

 

<table-stripe>

<table class="table table-striped">

 

<table-bordered>

 

<table class="table table-bordered">

 

<table-hover>

 

마우스 올렸을 때 효과

<table class="table table-hover">

 

<table-condensed>

 

셀 패딩이 반으로 감소되어 테이블 사이즈가 줄어든다

<table class="table table-condensed">

 

 

<tr 속성>

 

1.active

2.success

3.warning

4.danger

 

 

        <table class="table">
            <tr class="success">
                <th>번호</th>
                <th>제목</th>
                <th>글쓴이</th>
            </tr>
            <tr class="warning">
                <td>1</td>
                <td>테이블 테스트</td>
                <td>김뉴림</td>
            </tr>
            <tr class="active">
                <td>2</td>
                <td>테이블 테스트</td>
                <td>또롱이</td>
            </tr>
            <tr class="danger">
                <td>3</td>
                <td>테이블 테스트</td>
                <td>나무늘보</td>
            </tr>
        </table>