Question

我正在尝试使用CSS放置徽标，但它没有显示出来。我尝试使用class = site-title

_Layout.cshtml

     <body>
    <header>
        <div class="content-wrapper">
            <div class="float-left">
                <p class="site-title">@Html.ActionLink("your logo here", "Index", "Home")</p>
            </div>
            <div class="float-right">
                <section id="login">
                    @Html.Partial("_LoginPartial")
                </section>
                <nav>
                    <ul id="menu">
                        <li>@Html.ActionLink("Home", "Index", "Home")</li>
                        <li>@Html.ActionLink("Categorie", "Index", "Categorie")</li>
                        <li>@{Html.RenderAction("CartSummary", "Panier");}</li>

CSS

 .site-title {
     color: #c8c8c8;
     font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
     font-size: 2.3em;
     margin: 0;
 }

 .site-title a, .site-title a:hover, .site-title a:active {
      background: none;
      color: #c8c8c8;
     outline: none;
     text-decoration: none;
 }

 .site-title {
     background: url(../Images/htc_magic_black_open2.jpg) no-repeat top left;
     display: block;
     width: 150px;
     height: 150px;
     text-indent: -9999px; /* hides the link text */
     }

我也试过这个

 <p class="site-title">@Html.ActionLink("your logo here", "Index", "Home", new { @class = "logo" 
     })</p>

也尝试了这个

 <p class="site-title">@Html.ActionLink("your logo here", "Index", "Home" ,null, new { @class = 
   "logo" })</p>

并将CSS更改为

 .logo {
     background: url(../Images/htc_magic_black_open2.jpg) no-repeat top left;
     display: block;
     width: 150px;
     height: 150px;
     text-indent: -9999px; /* hides the link text */
     }

但我在前面留下了class = site-title。有什么建议吗？

Answer 1

我无法添加评论，因为我是新注册的，所以不幸的是它必须进入答案框......

如果您使用完整网址（即http://www.example.com/images/htc_magic_black_open2.jpg）替换相对“../Images/htc_magic_black_open2.jpg”路径，图片是否会显示？这将确定它是否是相对路径问题。

如果在.site-title类中添加“background-color：red”类，该框会变红吗？如果没有，也许你的CSS没有应用。

Answer 2

最后，徽标正在显示。 css并不令人耳目一新。我关闭了包括Visual Studio在内的所有内容，我尝试使用背景颜色：红色，最后显示出来。我删除了背景颜色：红色;我添加了徽标。谢谢你的帮助。

这是我用过的CSS。

 .site-title {
    color: #c8c8c8;
    font-family: Rockwell, Consolas, "Courier New", Courier, monospace;
    font-size: 2.3em;
    margin: 0; 
    background: url(../Images/large-logo.png) no-repeat top left;
    display: block;
    width: 602px;
    height: 132px;

html.ActionLink使用类使用CSS放置徽标，徽标永远不会显示出来

2 个答案: