【解決方法】ASP.NET MVC レイアウトの問題点


コード:

<div class="navbar navbar-inverse navbar-fixed-top">
       <div class="container">
           <div class="navbar-header">
               <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                   <span class="icon-bar"></span>
                   <span class="icon-bar"></span>
                   <span class="icon-bar"></span>
               </button>
               @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
           </div>

           <div class="navbar-collapse collapse">
               <ul class="nav navbar-nav">
                   <li>@Html.ActionLink("Home", "Index", "Home")</li>
                   <li>@Html.ActionLink("About", "About", "Home")</li>
                   <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
               </ul>
           </div>
       </div>
   </div>

私が試したこと:

画像はこちら

解決策 1

ここにいる私の友人が言おうとしているのは、CSS に問題があるように見えるということです。

コードは、デフォルトの ASP.Net MVC Razor コードに従います。1) このコードは、 *体* 要素、および 2) 必要なすべての CSS ファイルがアプリケーションによって検出されること。

デフォルトの ASP.Net MVC アプリ ソース:

<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/">Application name</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="/">Home</a></li>
                    <li><a href="/Home/About">About</a></li>
                    <li><a href="/Home/Contact">Contact</a></li>
                </ul>
                    <ul class="nav navbar-nav navbar-right">
        <li><a href="/Account/Register" id="registerLink">Register</a></li>
        <li><a href="/Account/Login" id="loginLink">Log in</a></li>
    </ul>

            </div>
        </div>
    </div>
    <div class="container body-content">
...
</Body>

*(CP が私の最初の提出物から削除した Body Tag を含めるように編集しました – おそらく html の問題を防ぐためです。)*

コメント

タイトルとURLをコピーしました