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>

有人可以告诉我，如果视觉工作室中有什么东西导致了这个问题吗？

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 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>（结束标记）不是可选的，所以它不会只是默默地添加它。这是理论，在实践中，浏览器以多种方式处理这个问题。当达到<div>时，其中一些会默默关闭</a>（然后</div>会关闭外部的一个），其他一些人则不会这样做（我重复一遍，因为它不是可选的结束标记）然后</div>将关闭内部（和右侧）。 IMO由于这种不可靠的行为，您应该要求您的开发人员/图形设计人员修复该代码。一般情况下（除了<hr>和<br>等少数例外），我会编写HTML代码，因为它是 XHTML。