HTML & CSS 3在锚或使用位置的不同含义使它成为“对”？

Question

编辑：

如果不是日期，我需要描述呢？(我应该使用段落，而对于验证，段落不能锚定，因为段落是块级别)

编辑的端

我相信你读了标题后不明白我想要什么。

我不知道如何写出一句话来总结我的问题。

所以，我的问题是：

我有锚与三个不同的东西在里面>图标，标题和日期。每一个都有不同的跨度。

我不知道这是否是正确的方法。

<ul id="m-items">
    <li>
        <a href="/post.php?name=ahf-_" class="m-item-header clear">
            <span class="m-item-icon"></span>
            <span class="m-item-title">ah%f#-$%^&amp;()_!</span>
            <span class="m-item-date">17 Feb 2013</span>
        </a>
    </li>
    <li>
        <a href="/post.php?name=d-3" class="m-item-header clear">
            <span class="m-item-icon"></span>
            <span class="m-item-title">d-3</span>
            <span class="m-item-date">16 Feb 2013</span>
        </a>
    </li>
</ul>

以上代码的完全篡改

我有另一种方法去做，我认为这是正确的方法，但我不确定…

我的第二个方法是使用带有两个元素的div，即锚点和包含文本的另一个div。

每一个都将处于绝对位置。

<ul id="m-items">
    <li>
        <div class="m-item-header">
            <a href="/post.php?name=ahf-_"></a>
            <div class="m-item-header-content clear">
                <div class="m-item-icon"></div>
                <div class="m-item-title">ah%f#-$%^&amp;()_!</div>
                <div class="m-item-date">17 Feb 2013</div>
            </div>
        </div>
    </li>
    <li>
        <div class="m-item-header">
            <a href="/post.php?name=d-3"></a>
            <div class="m-item-header-content clear">
                <div class="m-item-icon"></div>
                <span class="m-item-title">d-3</span>
                <span class="m-item-date">16 Feb 2013</span>
            </div>
        </div>
    </li>
</ul>

以上代码的完全篡改

我想知道哪一种方法是正确的，以及为什么(对搜索引擎优化和HTML本身)。

编辑：

如果不是日期，我需要描述呢？(我应该使用段落，而对于验证，段落不能锚定，因为段落是块级别)

编辑的端

~谢谢

Answer 1

这很符合你的口味。

由于以下原因，我宁愿选择第一种：

• 较小的标记->更好的概述和可维护性以及较小的文件大小
• 没有绝对定位-应尽可能避免(代码的性能和健壮性)
• 语义上更清楚--元素属于链接(如果您的标记是这样的话)

从SEO的角度来看，第一个解决方案显然更好，因为元素和链接之间的相关性是明确的，而对于第二个代码示例则不是这样。

Answer 2

不确定SEO的含义是什么(如果确实有任何)，但两者对您的网站行为有不同的含义。

第二个示例中的锚标记将是不可点击的。如果里面没有某种内容，用户就不会看到它，而您试图实现的导航方面(如指向另一个页面的href所证明的那样)将无法工作。

编辑

这就是我为什么不先看小提琴的原因。是的，上面的内容是错误的，你是通过将你的锚放在其他内容之上来实现这一点的。我将同意上面的海报，将内容包装在锚元素中在语义上是正确的，这就是我所建议的。

Answer 3

两者都不是对的，但也不是错的。从可用性的角度来看，我强烈支持第一个，因为项目数据都封装在链接中，因此更便于导航。