xhtml - 语义HTML实践

我在网上阅读了有关语义HTML的内容...

因此，下面是语义，

<h1>My Website Name</h1>
<h2>My Website Tagline </h2>

那下面呢？

<div id="header">
  <h1><span class="hide">My Website Name</span></h1>
  <h2><span class="hide">My Website Tagline</span></h2>
</div>

我倾向于像上面那样将h标签与div和span标签结合使用-是否将此实践视为缺乏语义？
hide类具有span的原因是我想显示站点徽标而不是文本。因此，使用CSS将h1的背景设置为图像，然后隐藏文本。这是不正确的做法吗？
然后，如果我不使用div，可以使用什么在h1和h2周围制作一个框？
据我所知，HTML 5还没有完全准备好，我们还不能使用<header>，我们可以吗？
谢谢。

最佳答案

如果要使用HTML5，我会做类似以下的事情:

<header>
  <hgroup>
    <h1>My Website Name</h1>
    <h2>My Website Tagline</h2>
  </hgroup>
</header>

记住要在CSS中添加display: block; to the HTML5 elements and createElement for IE。 header元素显示该块是标题，而hgroup元素则显示第二个h *元素是一个子标题，因此在计算文档中的标题级别时不应将其考虑在内。

如果您还不想使用HTML5，则可以使用div代替新元素，并使用HTML5元素名称作为类值。当您在实际站点上舒适地使用HMTL5时，这将使切换变得更加容易。

您实际上并不需要使用span元素。您可以使用一些技巧，例如在CSS中使用较大的负文本缩进来将文本隐藏在屏幕之外。

关于xhtml - 语义HTML实践，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/4669736/