HTML 解析不佳答案

【问题标题】：HTML gets parsed poorlyHTML 解析不佳
【发布时间】：2016-03-11 03:56:04
【问题描述】：

我的 HTML 在被浏览器解析后不知何故搞砸了。

这是我的输入：

 <a href="/quotes/{{ $quote->id }}" style="text-decoration: none; color: inherit; display: block">
     <blockquote>
         <p id="quote-{{ $quote->id }}-text">{{ $quote->quote }}</p>

         <small class="author" id="quote-{{ $quote->id }}-author">
             <a href="/authors/{{ $quote->author->username }}">{{ $quote->author->name }}</a>
         </small>
     </blockquote>
 </a>

这是我从 Chrome 开发工具得到的输出：

    <body>
<a href="/quotes/{{ $quote->id }}" style="text-decoration: none; color: inherit; display: block">
         </a> <!-- Why is it closing this tag over here? -->
    <blockquote><a href="/quotes/{{ $quote->id }}" style="text-decoration: none; color: inherit; display: block">
             <p id="quote-{{ $quote->id }}-text">{{ $quote->quote }}</p>

             <small class="author" id="quote-{{ $quote->id }}-author">
                 </small></a><small class="author" id="quote-{{ $quote->id }}-author"><a href="/authors/{{ $quote->author->username }}">{{ $quote->author->name }}</a>
             </small>
         </blockquote>
     </body>

问题是浏览器在解析html时关闭了a标签，我认为，blockquote不再被a包裹。如何将blockquote 包装在a 标记中？

谢谢！

【问题讨论】：

这不是正确的语义，看起来你在锚点中有一个锚点。这就是为什么它以及其中包含段落标签的块引用都搞砸了。所以你不知道如何写正确的html？？？询问是因为标签有实际作用！
好吧，我不是 html 专家，但这正是我想做的。一个可点击的blockquote，作者也被a 标签包裹。还有其他方法可以实现吗？

标签： html laravel anchor blockquote

【解决方案1】：

是的，你是对的。 a 标签（是 inline-tag）不能包含 blockquote 标签（是块级标签）。所以，我认为如果你想将块引用包装在 a 标记中是不可能的。

看看这条规则：Block-Level tags versus Inline tags

块级标签可以包含内联标签。

反之则不然——内联标签不能包含块级标签。

一些块级元素可以包含其他一些块级元素。

或者也许你可以使用 javascript onclick 事件来重定向：

<blockquote onclick="window.open('/quotes/{{ $quote->id }}')">
     <p id="quote-{{ $quote->id }}-text">{{ $quote->quote }}</p>

     <small class="author" id="quote-{{ $quote->id }}-author">
         <a href="/authors/{{ $quote->author->username }}">{{ $quote->author->name }}</a>
     </small>
 </blockquote>

【讨论】：

非常感谢。好主意..我对其进行了一些调整：<blockquote onclick="window.location = '/quotes/{{ $quote->id }}';" style="cursor: pointer"> 所以现在它更像是anchor