Web 表单和引导表单问题答案

【问题标题】：Web Forms and Bootstrap Form IssueWeb 表单和引导表单问题
【发布时间】：2014-07-03 17:02:59
【问题描述】：

我在 ASP.NET Web 窗体项目中使用精简版的 Admin LTE Bootstrap 主题。在 Web 表单项目中，每页只能使用 1 个表单标签。

表单标签需要绕过所有顶部（Nav）和底部（Side Bar Left & Main，主要内容）。这两个部分都有需要表单进行渲染的元素。这是页面和 div 的基本布局（我命名了其中的一些，以便您可以看到与我在下面写出的标签的关系。

<Body>
<Form>
<header>   
    <Nav Bar>   
        <Nav Bar -Right>
    </Nav Bar>
</header>
<Wrapper>
    <Side Bar -Left>
    <Main Content -Right>
</Wrapper>
</Form>
</Body>

当我将表单标签放在所有主要的 div 周围时，我会从整个屏幕的边缘获得一种样式或推动，它会将我的徽标（png 或 jpg）推出导航向下。这就是它的样子。

所以当我将表单标签放在正文和标题之间时，我没有其他地方可以放置它。表单标签的末尾放置在正文结束标签和包装器结束标签之间。那是它唯一可以去的地方。包裹在引导程序周围的表单将所有内容都推到导航中。

我正在使用的框架在这个链接上是开箱即用的：

enter link description here

任何关于如何从搞砸我的标题标签内容并将它们向下推来获取表单标签的想法。我曾尝试使用开发人员工具，但我有太多样式需要整理。是否像在css中杀死form标签上的格式一样简单。我试过了，它有帮助。有什么想法吗？

【问题讨论】：

标签： css asp.net forms webforms

【解决方案1】：

不确定这是否可行，但您可以尝试一下。在表单中添加一个名为 test-form 的类，然后将此 css 添加到页面中

.test-form {
     position: fixed;
     margin: 0;
     padding: 0;
     z-index: 0;
     top: 0;
     left: 0;
     width: 0;
}

更新：这就是解决方案

“我发现错误是因为主题使用以下 css 作为标题和侧栏：body > .header 所以通过从任何 AdminLTE header.less 文件中删除 > 应该可以工作”

【讨论】：

谢谢我试试看。
很抱歉，它不起作用。我什至尝试将它放在我的覆盖页面中，我将它放在 LTEAdmin.css 中，我尝试将它内联。添加 !important 大声笑
另一种解决方案是使用 jQuery 或 javascript 来序列化您的表单。
我发现错误是因为主题使用以下css作为标题和侧栏：body > .header 所以通过从任何AdminLTE header.less文件中删除>应该可以工作
那行得通。我不得不在 header.less 和 adminLTE.less 中更改它，一切顺利！