Question

我知道还有很多其他主题。事实上，这就是我能够从其他人发布的一些示例代码开始，然后我根据我的需求进行了调整。我的问题是我不能让表头始终居中。

#TableHeaderFixed {
    position:fixed;
    margin:0 auto 0 auto;
    top:0px; 
    width:900px;
    display:none;
}

不要担心“display：none”我的javascript处理进入和退出可见性。我一直试图读取并查看“margin”参数是否与“top”参数冲突。这是关键：我可以删除margin参数。但我不能删除顶部，或将其更改为其他任何东西，我的javascript取决于它。是的，它需要成为固定的位置。很糟糕，但这就是我必须要做的事情。我已经尝试过使用

了

top:0
left:50%
margin-left:-250px

左边会使它居中，然后剩下的边距是化妆的一半宽度以使其恢复，但这不起作用。边缘左边似乎与左边冲突，就像我之前提到的顶部与边距冲突一样，因为边缘命令永远不会工作所以它偏离中心。

如果您需要更多详细信息，请与我们联系。

ADDON：

<asp:Table ID="UnitList2" runat="server" />
<asp:Table ID="TableHeaderFixed" runat="server" />

<script type="text/javascript">
   var tableOffset = $("#UnitList2").offset().top;
   var $header = $("#UnitList2 > thead").clone();
   var $fixedHeader = $("#<%= TableHeaderFixed.ClientID %>").append($header);

   $(window).bind("scroll", function () {
       var offset = $(this).scrollTop();

       if (offset >= tableOffset && $fixedHeader.is(":hidden")) {
           $fixedHeader.show();
       }
       else if (offset < tableOffset) {
           $fixedHeader.hide();
       }
   });

<style>
#TableHeaderFixed {
    position:fixed;
    margin:0 auto 0 auto;
    top:0px; 
    width:900px;
    display:none;
}
</style>

所以你可以看到它是Javascript，它取出了UnitList2表头的副本，然后当你滚动到实际的标题之后使它可见，而当你向后滚动时它是不可见的。

服务器端样式

        TableHeaderFixed.Width = "900"
        TableHeaderFixed.Attributes.CssStyle.Add("margin-top", "0px")
        TableHeaderFixed.Attributes.CssStyle.Add("margin-left", "auto")
        TableHeaderFixed.Attributes.CssStyle.Add("margin-right", "auto")
        TableHeaderFixed.CellPadding = "2"
        TableHeaderFixed.CellSpacing = "0"

Answer 1

<强>更新：

试试这些。

http://jsfiddle.net/EdwJv/

忽略代码，去小提琴

<table> 
<colgroup>
<col span="1" style="width: 10%;">
<col span="1" style="width: 20%;">
<col span="1" style="width: 70%;">
</colgroup>
<thead>....</table>

头部的CSS

#hor-minimalist-b th {
    font-size: 17px;
    font-weight: normal;
    color: #719ECE;
    padding: 10px 8px;
    border-bottom: 2px solid #6678b1;
    text-align:center;
}

Answer 2

OP在编辑和评论中写道：

<强>解答：

想出来。

正在应用的ASP css样式优先于任何内联或css样式表规则。

在ASP代码中，我将样式添加到“margin-left：auto; margin-right：auto;”行中。试图让它居中。然后当我试图将内联样式置于中心时“左：50％; margin-left：-450px;”由于已经应用了ASP样式，或者之后应用了ASP样式，因此它没有取得边缘css，因此优先。

感谢您的帮助2207792但是，像往常一样，通过它进行讨论会让您开箱即用

使表头始终可见并始终居中

2 个答案: