0

私はこれを取得しようとしています:

ここに画像の説明を入力

しかし、私はこれを取得しています:

ここに画像の説明を入力

私の _Layout.cshtml:

<!DOCTYPE html>
<html>
<head> 
    <title>@ViewBag.Title</title> 
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> 
    <script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")" 
type="text/javascript"></script> 
</head>
<body>
 <div id="header"> 
        <div class="title">SPORTS STORE</div> 
     </div> 
     <div id="categories"> 
         @{Html.RenderAction("Menu", "Nav");} 
     </div> 
     <div id="content"> 
        @RenderBody() 
    </div>
</body>
</html>

マイ Menu.cshtml:

@model IEnumerable<string> 

@{ 
    Layout = null; 
} 

@Html.ActionLink("Home", "List", "Product") 

@foreach (var link in Model)
{ 
    @Html.RouteLink(link, new
                          {
                              controller = "Product",
                              action = "List",
                              category = link,
                              page = 1
                          }) 
}

私のサイト.css:

BODY { font-family: Cambria, Georgia, "Times New Roman"; margin: 0; }
DIV#header DIV.title, DIV.item H3, DIV.item H4, DIV.pager A {
    font: bold 1em "Arial Narrow", "Franklin Gothic Medium", Arial;
}
DIV#header { background-color: #444; border-bottom: 2px solid #111; color: White; }
DIV#header DIV.title { font-size: 2em; padding: .6em; }
DIV#content { border-left: 2px solid gray; margin-left: 9em; padding: 1em; }
DIV#categories { float: left; width: 8em; padding: .3em; }

DIV.item { border-top: 1px dotted gray; padding-top: .7em; margin-bottom: .7em; }
DIV.item:first-child { border-top:none; padding-top: 0; }
DIV.item H3 { font-size: 1.3em; margin: 0 0 .25em 0; }
DIV.item H4 { font-size: 1.1em; margin:.4em 0 0 0; }

DIV.pager { text-align:right; border-top: 2px solid silver;
    padding: .5em 0 0 0; margin-top: 1em; }
DIV.pager A { font-size: 1.1em; color: #666; text-decoration: none;
      padding: 0 .4em 0 .4em; }
DIV.pager A:hover { background-color: Silver; }
DIV.pager A.selected { background-color: #353535; color: White; }

DIV#categories A  
{
    font: bold 1.1em "Arial Narrow","Franklin Gothic Medium",Arial; display: block;
    text-decoration: none; padding: .6em; color: Black;
    border-bottom: 1px solid silver;
}
DIV#categories A.selected { background-color: #666; color: White; }
DIV#categories A:hover { background-color: #CCC; }
DIV#categories A.selected:hover { background-color: #666; }
4

1 に答える 1

0

この例は、ASP.NET MVC 3 PRO ブックからのものです。私はこれを試しましたが、これはうまくいきました。コードのダウンロードを参照するか、コードが適切であることを確認することをお勧めします。

コードにあるものからは正しいように見えますが、おそらくキャッシュを更新するか、Firebug などの開発者ツールを使用して何がレンダリングされているかを確認する必要があります。

これは、div id=categoriesのFirebugにあるはずのものです

DIV#categories {
    float: left;
    padding: 0.3em;
    width: 8em;
}

その中のタグの場合。

DIV#categories A {
    border-bottom: 1px solid silver;
    color: Black;
    display: block;
    font: bold 1.1em "Arial Narrow","Franklin Gothic Medium",Arial;
    padding: 0.6em;
    text-decoration: none;
}
于 2012-06-30T21:25:37.177 に答える