怎样在使用bootstrap框架的表格内容和字体居中

 我来答
威信211277949
2017-04-24 · 超过70用户采纳过TA的回答
知道答主
回答量:96
采纳率:0%
帮助的人:65.5万
展开全部
text-align: center; 虽然用了bt,但是页面上大部分区域还是要自己写样式的,bt提供的只是个布局上的便利
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
k7...4@33sn.cc
2017-04-24
知道答主
回答量:57
采纳率:100%
帮助的人:13.4万
展开全部

设置如下样式是可以使表格内容居中的,没有居中的原因可能是你还设置了其他的样式(把这个样式覆盖了):


.table th, .table td { 
text-align: center; 
height:38px;
}
你可以新建一个单独的html文件复制如下代码来测试一下:


<!DOCTYPE html>
<html>
    
    <head>
        <title>
            Bootstrap Table
        </title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <!-- Bootstrap -->
        <link href="
        rel="stylesheet">
        <style>
            .table th, .table td { 
text-align: center; 
height:38px;
}
        </style>
    </head>
    
    <body>
        <div class="container">
<div class="row">
                <div class="col-md-10">
                    <h1>
                        表格(内容居中)
                    </h1>
                    <table class="table" >
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>First Name</th>
<th>Last Name</th>
                                <th>Username</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>1</td>
                                <td>Mark</td>
                                <td>Otto</td>
                                <td>@mdo</td>
                            </tr>
                            <tr>
                                <td>2</td>
                                <td>Jacob</td>
                                <td>Thornton</td>
                                <td>@fat</td>
                            </tr>
                            <tr>
                                <td>3</td>
                                <td colspan="2">Larry the Bird</td>
                                <td>@twitter</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <script src="
        <script src="
    </body>
</html>

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式