Question

我有一个自定义创建的表，并通过CSS在.ascx中设置样式。见下文：

<style>

.divTable {
    display: block;
    height: auto;
    width: calc(100% - 25%);
    font: normal 12px/150% Arial, Helvetica, sans-serif;
    overflow: hidden;
    text-align: left;
    }

.divBody {
    position: relative;
    height: calc(100% - 42px);
    border: 2px solid #000000;
    font-size: 12px;
    font-weight: normal;
    top: 0px;
    left: 0px;
    right: 0px;
    overflow-x: scroll;
    overflow-y: scroll;
    color: #383838;
    width: auto;
    height: 500px; -- this is the one I am trying to get to be the custom height; either 500px if on a view tab or auto if on another tab.
    }
....
</style>

现在，这是一个名为DataGridForDetails的自定义控件。当我把它带到'VIEW'页面时，它会完美地列出内容，看起来很棒。但是，我有一个'DETAILS'表单，该控件被重新用于其他数据，这些数据可能有或没有表中的任何项目（即用户点击视图中的一行，将它们带到详细信息页面其中有2个数据网格显示资产成本和时间表成本。）

我希望能够重新使用这个数据网格，以便它可以在视图选项卡上高出500px，但是，当它在其他页面上时，它是自动高度。

有没有办法做到这一点？我尝试过使用!important，.style1.style2。除了为其他页面创建一个新控件之外的一切（也许这是需要做的事情？）。

干杯。

Answer 1

一个建议

设计您的用户控件，就像使用div和表一样
为视图标签创建单独的css文件
为其他页面创建不同的css文件

并在css中使用 ID选择。这是使用＃div，＃Table等。所以它会影响该页面上的所有div。

将css小心地应用到相应的页面上。

我不确定这是最好的方法。

Answer 2

因此，我没有创建单独的CSS样式表，而是修改了原始的CSS样式和类名，然后在后面的代码中，根据它是否是“VIEW”选项卡或其他选项卡，我运行if else语句，将相应的类分配给网格。

它可能不漂亮，但它确实有效。

希望这有帮助。

干杯。

If Request.RawUrl.Contains("VIEW") Then
        sb.AppendLine("<div class='divBodyView' id='" & TableName & "'>")
    Else
        sb.AppendLine("<div class='divBodyOther' id='" & TableName & "'>")
End If

.divBodyView {
position: relative;
border: 2px solid #000000;
font-size: 12px;
font-weight: normal;
top: 0px;
left: 0px;
right: 0px;
overflow-x: scroll;
overflow-y: scroll;
color: #383838;
width: 100%;
height: 100%;
}

.divBodyOther {
position: relative;
border: 2px solid #000000;
font-size: 12px;
font-weight: normal;
top: 0px;
left: 0px;
right: 0px;
overflow-x: scroll;
overflow-y: scroll;
color: #383838;
width: 100%;
height: 100%;
}

覆盖自定义控件的CSS样式

2 个答案: