Html 将纯文本与a<；部门>；？

新的html-以及新的做它正确

我有一个简单的问题，但它是我将继续做出的许多决定的基础，因此我需要正确地开始

        <div id="site-master-social">Find us at:
            <a href="http://www.OurWebsite.com"><img src="/Images/icon_fb.png" alt="Facebook" title="Find us on Facebook" /></a>
        </div>

请访问以下网址找到我们：

---

问题是关于下面的html片段。在包装Div中，有一些元素-一些文本、一个超链接和一个图像。问题是，文本“Find us at:”应该包含在span这样的标记中，还是可以只在Div标记中“float”呢？

从技术上讲，这是可以的，但我不建议这样做。它使文本成为某种隐含的伪元素。在这种情况下，建议将此类文本放入

中。如果下面的元素是一个相关的输入字段，那么它将是一个标签。如果它的文本比它的文本多，那么它可能应该在

中

---

这些选项中的每一个都使您能够更直接地控制显式内容/元素。

这里没有对错

然而，就我个人而言，我会将文本包装在

span

标记中。这意味着，在将来，如果您希望专门针对文本的样式，这将更容易做到：

<div id="site-master-social">
    <span>Find us at:</span>
    <a href="http://www.OurWebsite.com">
       <img src="/Images/icon_fb.png" alt="Facebook" title="Find us on Facebook" />
    </a>
</div>

#site-master-social span
{
}

请访问：
#网站主社交广度
{
}

不过，正如我所说，这只是个人的看法。您的标记本身具有完美的语义。

from

当没有其他元素适用时，div元素用作 最后手段。否则，它会导致用户的可访问性差 读者

---

DIV没有语义含义，因此，如果内容确实包含一些含义，残疾人就不太容易访问它

这也意味着你更难具体设计这个短语。 更重要的是，如果您以后想以某种方式（regex等）对其进行操作，则很难使用javascript访问此textNode属性

span

也没有特别的含义，但您可以为其分配类，然后再为其分配javascript，这比不分配类要容易得多

为完整起见，我将添加Paul D.Waite和我之间讨论的结论：（见评论）

因此，我建议将文本包装在

span

中，并添加

class

属性 对于这个特定的情况，我会考虑使用<代码> <代码>，因为HTML5具有分段范围，它看起来像这个部分的标题。

<section id="site-master-social"> 
<h1>Find us at:</h1> 
<ul> 
<li>facebook</li> 
<li>google+</li> 
etc...
</ul> 
</section>

请访问：

facebook
谷歌+
等

如果你需要，就把它包起来，否则我会说，把它打开

这就像读一本书或一篇文章。如果您以某种方式将文本标记为“特殊”，在您的情况下，通过将其包装在

元素中，您会告诉屏幕阅读器等工具，文本以某种方式是特殊的。如果你不包装它，他们会正常地阅读它，我想这就是你想要的

---

（然而，屏幕阅读器倾向于更多地关注像

或类似的元素，span可能会被忽略。）

当然。这很完美，除非您需要以某种方式对其进行格式化。

除非您需要某些特定格式，否则我会将其保留为“浮动”。这没关系，但是如果您希望文本和图像正确对齐，您可能会发现将其包含在一个范围内更容易。注意：图像的alt文本有点奇怪。这篇文章的整体内容是“在Facebook上找到我们”。@PaulD.Waite——被点名的Paul——这篇文章还没有写完。有一点是对的，一点是错的：我想你的意思是“”，而不是“”：）@PaulD.Waite啊，为此干杯！“DIV没有语义含义，因此残疾人更难访问它。”-哦，没有。如果您的元素与HTML提供的任何含义都不匹配，那么

就完全正确，因为它不会误导内容。@PaulD.Waite您什么时候会在没有语义含义的页面中放置文本？我不知道。我不是说要这样做：我是说要输入不适合HTML元素的内容。@PaulD.Waite I，但他说的是文本，意思是描述在哪里可以找到他的网站在线。这正是span@PaulD.Waite谢谢你，我已经编辑了答案，让它更有意义