Visual Studio折叠HTML代码

Question

我有一些如下的html代码，由我们的图形开发人员提供。 问题是当我将其导入asp.net（c＃）页面时，我看到了很多孤立的div。 感觉好像几个关闭div都没有打开div。 以下是代码段。

<div class="col-lg-2 col-lg-3 quick-launch">
    <div class="thumbnail">
        <a href=""> <img src="assets/img/app_images/app_7.jpg" width="115" height="114">
        <div class="caption">
            <h3>TEST</h3>
        </a></div>
    </div>
</div>

有人可以在这里让我知道Visual Studio中是否有引起这种情况的事情吗？

Answer 1

您正在反转<div>和<a>结束标记。 这是有效的HTML（但不是有效的XHTML，因此最好检查DOCTYPE ），但可能会使Visual Studio编辑器混乱 ：

<a href=""> <img src="assets/img/app_images/app_7.jpg" width="115" height="114">
    <div class="caption">
    <h3>TEST</h3>
    </a>
</div>

a应该是：

<a href=""> <img src="assets/img/app_images/app_7.jpg" width="115" height="114">
    <div class="caption">
        <h3>TEST</h3>
    </div>
</a>

编辑：这有什么问题？ 之所以有效，是因为HTML解析器不会抱怨 <a><div><a/></div> （如果DOCTYPE不是XHTML ），但是您应该抱怨它。 让我解释一下：解析器不会抱怨，因为</div> （结束标记）不是可选的，所以它不会只是默默地添加它。 从理论上讲，实际上浏览器可以通过多种方式处理此问题。 当到达</a>时，其中一些会默默关闭<div> （然后</div>将关闭外部的一个），另一些则不这样做（我重复一遍，因为它不是可选的关闭标记），然后</div>将关闭内部（和右侧）一个。 IMO由于这种不可靠的行为，您应该要求开发人员/图形设计人员修复该代码。 一般来说（除了<hr>和<br>这样的少数例外），我会编写HTML代码， 因为它是 XHTML。