设计与<a> and </a> <article> <a>

Question

I'm working with the jquery.accordion.js库发生冲突，一切都很好，但是当我尝试时，我与设计存在某种冲突用<article>标记包装设计更改的<a>。使用Test2我有我想要的设计，但是测试设计发生了变化，因为我在<a>标签周围使用<article>标签。我希望当用户点击该行（它不需要只是字母）时才能执行该操作，这就是为什么我要使用<article>嵌入{ {1}}标记，否则如果我将<a>标记放在<a>内，则只有当用户点击单词而非整行时才会执行操作，您知道为什么会发生这种情况吗？或者，如果您有其他建议，欢迎这样做：）

<article>

以防万一我需要查看我的CSS代码：

<section id="demo" data-accordion-group>
<data-accordion>
 <article data-control class="rounded test hand">Test</article>
        <div data-content>
            <a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension"> <article class="articleItem">FileName</article></a>
            <a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension"> <article class="articleItem">FileName</article></a>
            <a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension"> <article class="articleItem">FileName</article></a>

            <article data-control class="rounded test hand"> Test2</article>
<div data-content>    

  <article class="articleItem hand" data-folder="FolderName" data-file="FileName"><a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension">FileName</a></article>
        <article class="articleItem hand" data-folder="FolderName" data-file="FileName"><a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension">FileName</a></article>
        <article class="articleItem hand" data-folder="FolderName" data-file="FileName"><a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension">FileName</a></article>
        <article class="articleItem hand" data-folder="FolderName" data-file="FileName"><a asp-action="Download" asp-controller="Apps" asp-route-folder="FolderName" asp-route-file="NameWithExtension">FileName</a></article>[![enter image description here][2]][2]

Answer 1

默认情况下，<a>是内联元素，这就是为什么会出现这些异常的原因。

解决方案：通过添加

将其转换为块

div[data-content] a {display:block}

到CSS。

顺便说一下，你应该通过验证器真正运行你的页面。