html - asp.net CSS 导航栏

Question

我想为 asp.net 链接创建一个 css 导航栏。

<div> 
    @{
        foreach (LangViewModel langViewModel in Model.Langs)
        {
            <p>
                @Html.ActionLink(langViewModel.Name, "Lang", "Home", new { 
         langID = langViewModel.Id }, new { })
            </p>
        }
 </div>

此代码生成 3 个链接，将我定向到我网站的其他页面，即

Numbers
Alpha
Alphanumeric     

现在我希望在导航栏中有这 3 个由 asp.net 生成的链接。 i was using w3schools as reference. 为此，我们需要使用 <ul> and <li>使用一些 css 按照以下方式标记。

<ul>
<li><a class="active" href="#home">Home</a></li>
 <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
   <li><a href="#about">About</a></li>
</ul>

但是我的链接是在上面的 ASP.NET 代码中生成的，所以我应该写些什么才能获得导航栏。

<li><a class="active" href="WHAT SHOULD DO HERE">Home</a></li>

Answer 1

Model

public class Langs
{
    public int ID { get; set; }
    public string Name { get; set; }
}

Controller

public class DemoController : Controller
{
    public ActionResult Index()
    {
        List<Langs> lidemo = new List<Langs>();
        lidemo.Add(new Langs { ID = 1, Name = "Home" });
        lidemo.Add(new Langs { ID = 2, Name = "About Us" });
        lidemo.Add(new Langs { ID = 3, Name = "Contact" });
        lidemo.Add(new Langs { ID = 4, Name = "Page 1" });
        lidemo.Add(new Langs { ID = 5, Name = "Page 2" });
        return View(lidemo);
    }
}

View

Output

Link For Markup Link For Mark of Navigation Bars