Question

我刚刚构建了一个页面，其中没有任何内容，但是包含一个标题和两个段落的div。我在CSS的div周围放了一个边框。当我浏览页面时，div和段落都有边框，并且在它上面有两个空的边界“div”。亲眼看看：https://ext.careersourcebroward.com/ITAList/

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title></title>
    <style>
        div {
            width:60%;
            border:5px double blue;
            text-align:center;
            border-radius:25px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <h1>ITA List</h1>
        <p>This is the ITA List</p>
        <p>There will be a table with the Programs listed below.</p>
    </div>
    </form>
</body>
</html>

我在昨天工作的另一个现有网站遇到了同样的问题。完全不同的网站。我在div中添加了一个内联css，将边框颜色更改为红色。它上面的两个幻影div仍然是蓝色的。

Answer 1

两个额外的div具有“aspNetHidden”类，它是从服务器端代码生成的。基于这些div的类，它们应该被隐藏起来。但是因为你没有加载任何css / sytle规则来定义这样的行为，所以它们被视为常规div，它被你自己的css规则覆盖。

Answer 2

这些div是由ASP.NET Web Form添加的，并且可能被您隐藏。正如您为所有div定义了一般css规则。它将应用于所有div，无论Web Form生成的div还是您创建的div。

 <style>
    div {
        width:60%;
        border:5px double blue;
        text-align:center;
        border-radius:25px;
    }
</style>

正如@Kblob建议您可以创建一个css规则，该规则将隐藏所有ASP.NET Web Form创建的具有类名aspNetHidden的div。为了在将来保存，您可以为div创建css类，并将这些类仅应用于所需的div。

Answer 3

您可以添加此样式：

.aspNetHidden {
    display: none;
}

为什么我的网页上会显示两个额外的div？

3 个答案: