Question

我想将自举样式应用于asp表单标记。使用下面的代码只显示没有frm样式的组件我正在使用bootstrap 3.3.1和VS2012 这是辅助页面

<%@ Page Title="" Language="C#" MasterPageFile="~/Maestra.Master" AutoEventWireup="true" CodeBehind="Pagina2.aspx.cs" Inherits="Ejemplo1001.Pagina2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">


    <form class="navbar-form navbar-left" role="form" runat="server" id="frm1">
        <div class="form-group">
            <input type="text" class="form-control" placeholder="Search"/>
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
    </form>
</asp:Content>

这是主页

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Maestra.master.cs" Inherits="Ejemplo1001.Maestra" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Bootstrap 101 Template</title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <link href="css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
        <nav class="navbar navbar-inverse">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">WebSiteName</a>
                </div>
                <div class="collapse navbar-collapse" id="myNavbar">
                    <ul class="nav navbar-nav">
                        <li><a href="inicio.aspx">Home</a></li>
                        <li class="active"><a href="Pagina1.aspx">Page 1</a></li>
                        <li><a href="pagina2.aspx">Page 2</a></li>
                        <li><a href="Pagina3.aspx">Page 3</a></li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li><a href="#"><span class="glyphicon glyphicon-user"></span>Sign Up</a></li>
                        <li><a href="#"><span class="glyphicon glyphicon-log-in"></span>Login</a></li>
                    </ul>
                    <p class="navbar-text navbar-right">Signed in as <a href="#" class="navbar-link">Mark Otto</a></p>
                </div>
            </div>
        </nav>
        <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
        </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="js/jquery-1.11.1.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>


    <script type="text/javascript">
        $(document).ready(function () {
            var url = window.location.pathname;
            var substr = url.split('/');
            var urlaspx = substr[substr.length - 1];
            $('.nav').find('.active').removeClass('active');
            $('.nav li a').each(function () {
                if (this.href.indexOf(urlaspx) >= 0) {
                    $(this).parent().addClass('active');
                }
            });
        });
    </script>
</body>
</html>

Answer 1

删除当前的CSS链接，并通过将CSS文件从解决方案资源管理器拖到母版页的head部分来重新创建它。然后它应该正确解决。

Answer 2

您可能需要在第二页的标题中添加样式表链接并检查目录root~ / css ...

<%@ Page Title="" Language="C#" MasterPageFile="~/Maestra.Master" AutoEventWireup="true" CodeBehind="Pagina2.aspx.cs" Inherits="Ejemplo1001.Pagina2" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<link href="~/css/bootstrap.min.css" rel="stylesheet" />
</asp:Content>

无法将引导样式应用于asp表单

2 个答案: