分离的元素被忽视,现在合并

时间:2016-11-05 19:58:42

标签: c# html asp.net-mvc razor

目前正在学习MVC,我认为它干扰了HTML代码。我只有一个基本的导航菜单作为列表,两个<li>项似乎合并为一个。有什么方法可以确保两者在现场分开?

@if ((Request.Url.AbsolutePath.ToString().ToLower() != "/home/index") && (Request.Url.AbsolutePath.ToString() != "/"))
{
    <nav data-spy="affix" data-offset-top="500" style="border-radius:0px; left: 0" ng-hide="sideBar" id="nav">
        <img src="~/Content/images/open.png" ng-model="sideBar" id="sideBarOpen" style="left:0px; top:0;"/>
        <div id="sideBar" style="left: -200px">
            <ul>
                <li><a href="@Url.Action("Index", "Home")" id="navHeader"> Home </a></li>
                <li><br /></li>
                <li><a href="@Url.Action("AboutMe", "Home")" id="">About Me</a></li>
#############
                <li><a href="@Url.Action("Experience", "Home")" id=">Experience</a></li>
                <li><a href="@Url.Action("Resume", "Home")" id="">Resume</a></li>

############ These two seem to be recognized as 1 <li> and not two.

                <li><a href="@Url.Action("Contact", "Home")" id="">Contact</a></li>
            </ul>
            <img src="/Content/images/myPic.jpg" />
                </div>
    </nav>
    <div id="sideBarBack" style="width:0%;">
    </div>
}

1 个答案:

答案 0 :(得分:1)

您在id=">部分错过了引号。这不是一个有效的HTML,所以你的文件浏览器会尝试解决这个问题,导致两个元素组合在一起。

要解决此问题,而不是:

<li><a href="@Url.Action("Experience", "Home")" id=">Experience</a></li>

使用正确的代码属性id=""

<li><a href="@Url.Action("Experience", "Home")" id="">Experience</a></li>