weixin_316529
2018-03-01 08:02
采纳率: 100%
浏览 4.7k
已采纳

DataTables 如何实现部分列的text靠左、部分列的text居中?

1.表头居中
2.部分td的text靠左排列,部分居中,部分靠右

css样式:

     <style>
        .table th {
            text-align: center;
        }
        .table tfoot tr th {
            text-align: left;
        }
        .align_right {
            text-align: right;
        }
        .align_center {
            text-align: center;
        }
    </style>

dt渲染表格,部分代码:

 columns: [
                {
                    "name": "areaName", "data": function (data) {
                    return '<span class="align_right">'+$.xfj_formatEmptyString(data.areaName,'--') + '</span>';
                }
                },
                {
                    "name": "employees", "data": function (data) {
                        return '<span class="align_center">'+data.employees+'</span>';
                }
                }
            ]
  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

7条回答 默认 最新

  • 已采纳
     span默认行内元素,设置text-align没用,要设置为块级元素才行
    .align_right,.align_center{display:block}
    
    或者span改为div
    
    
    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • 年轻不拽园 2018-03-01 08:03

    每一个对应加着:align:(left,center,right),

    评论
    解决 无用
    打赏 举报
  • qq525412561 2018-03-01 08:07

    请问是要在页面显示吗?

    评论
    解决 无用
    打赏 举报
  • qq525412561 2018-03-01 08:10

    靠左的设置相同的class,靠右的也设置相同的class,表头都是th 然后css样式控制就好了

    评论
    解决 无用
    打赏 举报
  • tan8jin12 2018-03-01 08:14

    td 页面设置相应的 样式:align:(left,center,right),

    评论
    解决 无用
    打赏 举报
  • 西吉哥 2018-03-01 08:14

    通过CSS选择器实现 :
    如控制第二列

    tr>td:nth-child(2){
                text-align: right;
    }
    

    如果jq那更简单
    $('tr').find('td:eq(1)').css('text-align','right');

    评论
    解决 无用
    打赏 举报
  • 大表哥g 2018-03-01 09:18

    写行内样式

     <span class="align_center"></span>';
    
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题