Bootstrap无法在asp.net mvc视图中工作

时间:2016-01-26 11:11:16

标签: asp.net asp.net-mvc asp.net-mvc-4

我有一个asp.net注册表视图,我使用bootstrap来获取响应式页面 但是当我在浏览器中运行页面时,它看起来与我在添加引导类之前所做的相同。我尝试在asp.net webform中使用相同的类,它工作正常。我的观点的代码如下:

    @model JustBlog.Core.Objects.User
       @{
   Layout = null;
        }

     <!DOCTYPE html>

 <html>
  <head>
<meta name="viewport" content="width=device-width" />
<title>Register</title>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js">    </script>
<script         src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.j     s"></script>
<script         src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js">       </script>

   </head>
    <body style="background-color:#EEE7CD;">
     <div class="container-fluid">
    @using (Html.BeginForm())
    {
        <div class="row-fluid">

            <div class="col-md-6">
                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="page-header" style="margin-top: 10px;">
                            <h3>Register Here</h3>
                        </div>
                        <table class="table">                             


                                        <tr>
                                            <td>
                                                @Html.LabelFor(m => m.firstName)
                                            </td>
                                            <td >
                                                @Html.TextBoxFor(m => m.firstName)
                                            </td>
                                            <td>
                                                @Html.ValidationMessageFor(m => m.firstName)
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                @Html.LabelFor(m => m.lastName)
                                            </td>
                                            <td>
                                                @Html.TextBoxFor(m => m.lastName)
                                            </td>
                                            <td style="color: Red">
                                                @Html.ValidationMessageFor(m => m.lastName)
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                @Html.LabelFor(m => m.Email)
                                            </td>
                                            <td>
                                                @Html.TextBoxFor(m => m.Email)
                                            </td>
                                            <td style="color: Red">
                                                @Html.ValidationMessageFor(m => m.Email)
                                            </td>
                                        </tr>


                                        <tr>
                                            <td>
                                                @Html.LabelFor(m => m.Username)
                                            </td>
                                            <td>
                                                @Html.TextBoxFor(m => m.Username)
                                            </td>
                                            <td style="color: Red">
                                                @Html.ValidationMessageFor(m => m.Username)
                                            </td>
                                        </tr>

                                        <tr>
                                            <td>
                                                @Html.LabelFor(m => m.Password)
                                            </td>
                                            <td>
                                                @Html.PasswordFor(m => m.Password)
                                            </td>
                                            <td style="color: Red">
                                                @Html.ValidationMessageFor(m => m.Password)
                                            </td>
                                        </tr>

                                        <tr>
                                            <td>
                                                <input type="submit" value="Register" />

                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                      @Html.ValidationSummary(true)
                                            </td>
                                        </tr>

                           </table>


     </div>
   </div>
  </div>
  </div>
    }
   </div>
   </body>
    </html>

1 个答案:

答案 0 :(得分:0)

您没有添加脚本和样式表来引用Bootstrap。您需要让您的站点获得对Bootstrap库的引用。

请参阅下文。您可以使用CDN链接它,只需将下面的链接添加到您的头部,您就可以在本地不下载Bootstrap。 在http://getbootstrap.com/getting-started/

上查看更多替代方案
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>