我正在尝试将一个 html 页面(已经有很多格式、指向 css 文件的链接、.js 文件等)集成到 asp.net 中
问题是 html 中使用的一些样式引用了表单元素，如下所示:
#Area form input[type="mytype"] {
content: '';
position: absolute;
display: block;
}
当我尝试将它包装在一个 asp.net 页面中时，它丢失了格式，因为我需要将所有内容放入一个带有 runat="server"的 asp.net“表单”中。 Css 变得困惑，因为它现在是表单中的表单和表单中的区域。
<!DOCTYPE html>
<html>
<head>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/all.css" rel="stylesheet">
</head>
<body>
<form method="post" action="uitest.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTUxMTcwNzgxMGRk/FKLdutHp78brNcMIqdbHqG7TcPZ3FoZf+HMkhw=" />
</div>
<div id="feature">
<div class="validate-form">
<span class="icon"></span>
<input class="required-email" type="email" placeholder="Email address">
<button class="btn"><span>Apply now</span></button>
</div>
</div>
</form>
</body>
</html>
解决这个问题的最佳方法是什么？我可以在 Css 中将“表单”重命名为其他名称吗？
谢谢
最佳答案
Web 窗体应用程序中不应该有嵌套窗体。如果您的 CSS 样式未被应用，则说明您的选择器未正确定位您的元素，或者您选择的元素的特异性低于具有冲突样式的另一个选择器。 runat=server 与它无关，因为该属性实际上并未呈现在页面上。
现在，您输入的类型似乎不合法。根据您的选择器，您应该具有类似以下的结构:
<div id="Area">
...
<form>
...
<input type="mytype" /> //ILLEGAL!!
</form>
</div>
为什么你有一个 mytype 输入？您应该只使用有效类型，例如 text。更改它们，然后添加:
#Area form input[type="text"]{
background-color:red !important; //This is just for testing, don't put into production!
}
如果您的输入没有红色背景，则调整为:
form input[type="text"]{
background-color:red !important; //This is just for testing, don't put into production!
}
如果您仍然遇到问题，请实际粘贴您的源代码(从您的浏览器而不是 Visual Studio 单击“查看源代码”)。
更新
为什么选择器中有 #Area？您的标记中没有具有该 ID 的元素。该选择器将起作用:
form input[type="email"]{ ... }
关于Asp.net 表单丢失 css 格式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22426421/