标签: semantic-markup

如果我有给定月份发生的事件列表，例如：

十月活动：

10 月 8 日 - 社区舞会 10 月 9 日 - 卡拉 OK 之夜 10 月 10 日 - 聚餐

最好的编码方法是什么——使用 UL、OL 还是其他？

无序列表

<h3>October Events</h3>

<ul>
   <li>Oct. 8 - Community Dance</li>
   <li>Oct. 9 - Karaoke Night</li>
   <li>Oct. 10 - Potluck</li>
</ul>

有序列表

<h3>October Events</h3>

<ol>
   <li>Oct. 8 - Community Dance</li>
   <li>Oct. 9 - Karaoke Night</li>
   <li>Oct. 10 - Potluck</li>
</ol>

如果我添加一个描述，你会改变看待它的方式吗？通过描述我可能会这样：

<h3>October Events</h3>

<article>
   <h4>Community Dance</h4>
   <p class="date">Oct. 8</p>
   <p>Description</p>
</article>

<article>
   <h4>Karaoke Night</h4>
   <p class="date">Oct. 9</p> …

我有一个想要显示的结构化语义数据，并使用 CSS 对其进行样式化。这是一个示例：

...<user name="John">...</user>...

我希望它被渲染成这样：

...
User John ...
...

如果我希望“User”和“John”具有相同的颜色，我可以使用以下 CSS：

user:before{
  content: 'User ' attr(name);
}

但是，我希望“用户”为蓝色，“约翰”为红色。我怎样才能用 CSS 实现这一点？

PS我不想改变我的数据表示。我知道我可以通过将数据转换为具有额外的 div 等轻松获得此类格式，但我想直接以其形式显示我的纯语义数据。

我刚刚被介绍到语义网和它的功能系列,但我很难理解其中的一些,我希望有人可以向我解释.

据我所知,RDF可以用几种语法编写.RDF/XML,Turtle等

现在,我理解XML.如何呈现以及如何解析它.但是,有些人用乌龟语法编写,但他们如何解析这些信息呢？我似乎无法找到任何语言的单个库来将用乌龟语法编写的信息"提取"为另一种形式.N3也是如此.它怎么用？执行还是其他？

我似乎能够理解RDFa.这是一种将RDF实现为XHTML的方法.对我而言,这是将RDF实现为"某事"的一种方式.但是我如何将其与龟,N3等进行比较呢？

提前致谢.

我目前有这样的设置:

<section id="intro"></section>
<header></header>
<section></section>
<section></section>
<footer></footer>

header元素是一个带有站点名称和基本信息的粘性标题.直到用户滚过#intro之后它才显示,因此它在DOM中.我想知道,从语义和可访问性的角度来看,将它变成div或section更有意义.

我在<br>标题中使用标签(例如h1),并且作为我的渐进增强响应式设计的一部分(这是一个例外吗？) - 我想将它隐藏在较窄的视口中.

当然,CSS规则是:

h1 br {
    display: none;
}

但是在HTML中解决这个问题的正确方法是什么？

如果它是这样的,那么当br隐藏时,"heading"和"with"之间没有空格:

1) <h1>Example heading<br>with a break right thurr</h1>

那么以下语义是否正确？

2) <h1>Example heading <br>with a break right thurr</h1>

或者这个呢？

3) <h1>Example heading<br> with a break right thurr</h1>

我知道,非常挑剔,但我很好奇.

PS在这种情况下,绝对必须使用a,br因为单词"Example heading"比"break sturr"短 - 使用流体容器会在不需要的地方强行打破.

另外,正如David指出的那样,示例#2和#3都可以工作 - 但它们在语义上是否正确？虽然HTML标签周围的空格是语义的并且被忽略(这就是我们如何使标记很好阅读)......但是元素标签内的空格呢？他们应该在那里吗？

我正在为我正在进行的项目获得以下页脚:

<footer>
  License: <a href="#">Creative Commons BY</a>
  Email: <a href="mailto:#">email@mail.com</a>
  Telephone: <a href="tel:#">0123456789</a>
</footer>

对于这个页脚,我希望每个链接(及其前缀)都显示在一个单独的行上,我希望尽可能在语义上有效,而不添加不必要的标记.

我已经考虑过:

• 的<br>标签,但它仅考虑在诗歌(或类似的内容,其中断行是信息的固有部分语义,所以我不能用它来打破线(见这个问题:点击标签语义交替使用)

• 使用一个ul,但它实际上不是一个列表,所以将它包装在一个ul也不是一个真正有效的选项.

• 使用固定宽度,但我真的想找到一个动态的解决方案.

• 用a围绕每一行<p>,这似乎有点过头了,因为它不是真正的段落,而是我正在包装的单行.

在没有添加额外标记的情况下,以语义上合理的方式打破这些行的最佳方法是什么？

我正在处理包含一些API指令的页面.我尽可能地努力使用正确的HTML代码,但是我对于在指令中使用GET一词(在这是一个GET请求,而不是PUT请求)中使用的内容感到困惑.这不是什么大问题,但它确实让我觉得我的工作做得更好一点.

这不是用户输入的内容,因此<kbd>看起来并不真实. <samp>似乎也不适合,因为它不会输出到屏幕上.我考虑过了<code>,但这并不恰到好处.

许多提供API指令的网站似乎并不关心语义.

有什么建议？

我应该使用哪些HTML5标签和微数据模式来描述要租用的公寓列表？

它们具有以下属性:

• 名称
• 图片
• 唯一号码
• 地点
• 描述
• 价钱

我的HTML结构目前是这样的:

<section id="featured">
    <h2>Featured appartaments</h2>
    <ul>
        <li>
            <article>
                <h3><a href="javascript:void(0);">House #1</a></h3>
                <img src="http://placehold.it/250x150/" alt="House #1" />
                <p>Ref. 40</p>
                <p>My location</p>
                <p>My description.</p>
                <p>Price: € 500.000,00</p>
            </article>
        </li>
        <li>
            <article>
                <h3><a href="javascript:void(0);">House #2</a></h3>
                <img src="http://placehold.it/250x150/" alt="House #2" />
                <p>Ref. 41</p>
                <p>My location</p>
                <p>My description.</p>
                <p>Price: € 500.000,00</p>
            </article>
        </li>
    </ul>
</section>

谢谢!

有一些标签与div元素没有任何不同,但是"需要"来创建语义HTML文档.我的问题是,这有多重要？

我同意使用列表来显示产品列表或菜单等内容的重要性.一个strong制造的东西看起来更重要或使用标签mark标记为高亮(发现)的关键字.我只是不知道div替代元素有哪些优点,比如

• section
• aside
• footer
• header
• article
• 等等...

什么是consequenses当你不正确地做这些"布局"语义？我读到它对电子阅读器和盲人有积极的影响.但是,当我使用一个程序作为Dolphin Supernova来测试我创建的网站是否可用于盲人时,我看不出具有"正确"语义标记的页面与我替换所有布局元素与默认div元素.那么为什么这些布局元素很重要.正确使用它们有什么好处.当你没有正确使用它们时,你会/影响谁？

我最近遇到的情况是我被<ul>用于HTML列表,但我真正想要的是<ol>.我正在绞尽脑汁试图设置一个变量,以便我可以根据需要随时更改它.然后我突然意识到,我可以使用CSS ul.class {list-style-type: decimal;}.这将使我完全符合我的要求.

但后来我想,为什么我们还有<ol>呢？它不应该被弃用吗？因此,列表类型不是一个独特的样式选择,属于样式表吗？至少,这总是解释为什么你不能从HTML页面复制和粘贴列表项目符号.然后我进一步想知道<dl>.是的,这更方便轻微一点,但你可以很容易地与嵌套相同的效果<div>,<p>,<ul>,或<span>.

在此的其他问题,似乎有人会说有一个语义质量<ol>和<dl>.我可以购买,特别是因为<dl>它,但它面对不断被告知列表类型是风格,而不是内容.还有更多的东西,我没有看到为什么他们还没有被弃用？