asp.net - ASP.NET Web 表单中的 CSS 选择器

Question

我有一个网络表单应用程序，其中包含用于布局的 CSS 文件。我的元素之一，在不使用 ID 的情况下在 CSS 中将变得更加困难，也必须具有 runat="server"，因为我控制服务器端的可见性。

<div id="x">
    <div id="whatever" runat="server" visible="false">
        <div id="y">
            ....
        </div>
    </div>
</div>

我的问题是，在 CSS 中，我不知道如何用我的选择器忽略 whatever div，除非我内联 CSS 并将服务器到客户端控制转换，否则我赢了'直到运行时才知道控件名称。

#x
{
    position:absolute;
    height:30px;
}

    #x #whatever??? #y img
    {
        margin:-7px 15px 0 30px;
    }

    #x #whatever??? div
    {
        width:250px;
        float:left;
    }
etc.

我应该如何解决这个问题？是否存在不呈现输出但可用于控制其内容的可见性/呈现的服务器端容器控件，或者 CSS 中是否存在忽略该中间 div 的技巧？

我在母版页中有 x div 而 whatever 和 y div 都在页面本身。我知道如果我使用 MVC，这将不是问题，但此时切换不是一个选项。

Answer 1

我不确定这是否只是您的示例，但您每次选择某些内容时似乎都在遍历整个树。这在 CSS 中不需要，下面的代码可以解决问题:

直接“x”选择器

#x 
{ 
    position:absolute; 
    height:30px; 
} 

“y”的后代图像

#y img 
{ 
    margin:-7px 15px 0 30px; 
} 

“x”的后代的任何 div

#x div 
{ 
    width:250px; 
    float:left; 
} 

Here是一种方便且易于理解的选择器解释，或多或少只需捕获您需要的选择器并在类似 here 的地方进行测试(我最喜欢的测试网站)。