一篇由 — Halim Shams 所写的文章

如果你告诉我，如果你一直以来发现你的网页流量没有增加，仅仅是因为你没有正确地使用HTML？HTML不仅仅是div、p、img和a这些标签；这只是冰山一角而已，仅仅为了任何目的只使用这些标签是完全错误的，这无疑会严重损害你网页的SEO。

让我们深入了解一下最容易被忽略的一些HTML标签，你绝对得知道。

首先来看 <abbr> 标签，也称为缩写标签。当你想解释一个缩写的意思时，会用到这个标签。

<abbr title="一种编程语言">Python</abbr>

``abbr标签的输出```

注意 <abbr> 标签中使用的 title 属性，这个属性可以应用于每个标签。现在，当你把鼠标悬停在那个缩写上时，会显示你设置的 title。这可以增强可访问性。我建议你把它用在按钮或图标上。

<code>标签对于显示代码块非常有用。你可以用CSS和普通的<p>标签让它看起来像一个代码块的样子，但既然有了这个专门为此的<code>标签，为什么要那样做呢？

    <p>在JS中，我们有这样的代码：<code>console.log("Heyo!")</code>。</p>

<code> ... </code> 的输出

你可以直接用CSS让它更美观。

kbd 标签

它就像 <code> 标签一样，我们还有一个 <kbd> 标签，也称为“键位标签”。它用来表示键盘输入的内容。

    <p>按住 Ctrl 开始吧。</p>

键盘标签的输出

你可以简单地使用CSS让它看起来像一个真正的键盘按钮。

<datalist> 和 <option> 标签。这些标签超级有用，用于显示建议或选项列表，而且比你想象的要简单。

    <input type="text" list="水果" placeholder="请输入水果名称">  
    <datalist id="水果">  
        <option value="苹果"></option>  
        <option value="橙子"></option>  
        <option value="香蕉"></option>  
    </datalist>

The <datalist>， <option> 标签，即这两个标签的作用是

记得，list属性的值必须与<datalist>标签的id属性相匹配，才能使它起作用。

专为编程发烧友准备的独家内容！订阅我们的电子报，获取技巧、小技巧和能帮助你提升编程旅程的建议。

关注

现在订阅吧!

第五个标签是<dialog>标签，它可快速轻松地创建弹出窗口或模态窗口。

    打开对话关注一下Halim Shams吧

<dialog>标签的输出

每次你添加了 open 属性时，弹窗就会出现。

第六个是 <details> 和 <summary> 标签。我惊讶于居然还有很多人不知道这些标签，因为它们非常实用。它们特别有助于创建无需 CSS 或 JavaScript 的原生下拉菜单，非常适合用于FAQ部分。

    <details>  
        <summary>谁值得关注?</summary>,  
        Halim Shams  
    </details>

<details> 和 <summary> 标签是用来显示内容的。

你會看到，如果你點擊那個小箭頭，內容就會出現和消失——完全不需要使用JavaScript或CSS。

第七个标签是 <time> 标签。此标签允许浏览器将时间作为实际值读取。它有助于搜索引擎抓取，并有助于提升网站的 SEO 性能，这是尽早开始的一个好习惯。

    <p>现在是<time>02:59</time>。</p>

The <time> 时间标签的输出

关于 <ruby> 和 <rt> 标签

在第八个位置上，我们有<ruby>，<rt>和<rp>标签。这些标签来源于Ruby注音记号，用于在一个单词或字符的上方显示一些附加信息的小文本。虽然这些标签主要应用于亚洲文字，但你也可以用它们来发挥创意。

    <ruby>👋  
        <rt>嗨</rt>  
    </ruby>

<ruby> 和 <rt> 标签的内容显示。

提示：您可以为不支持 Ruby 注记的浏览器添加 <rp> 标签来包裹文本。这是一种简单的方法，可以在不使用 CSS 的情况下在文本上方添加其他文本，完全不需要 CSS。

如果你觉得这些信息有用，可以关注我，获取更多类似内容。也别忘了分享给朋友们。

别忘了订阅我专为我的粉丝们准备的专属通讯哦👇

立即订阅!

— 您也可以在 X（原来的 Twitter） 或 LinkedIn 关注我，在那里我会分享一些超棒的小东西，所以可别错过了。🚀

给我买杯咖啡呗☕