很棒的 HTML 标签和属性

2025-06-07

很棒的 HTML 标签和属性

在这篇文章中我将与您分享一些很酷的 HTML 标签和属性。

  • title 属性指定有关元素的额外信息。当鼠标移到元素上时,该信息通常显示为工具提示文本。
<p title="I'm a tooltip">I have a tooltip</p>
Enter fullscreen mode Exit fullscreen mode

替代文本

  • mark 标签 - 括号内的所有内容都会被高亮显示。大多数屏幕阅读技术在默认配置下不会显示 mark 元素。这里有一篇关于如何解决这个问题的好文章。
<p>This is a <mark>paragraph</mark></p>
Enter fullscreen mode Exit fullscreen mode

替代文本

  • HTML contenteditable 属性指示内容是否应由用户编辑。
<p contenteditable>Write your name here</p>
Enter fullscreen mode Exit fullscreen mode

替代文本

  • meter 元素用于显示仪表。meter 元素不应用于指示进度(例如进度条)。对于进度条,请使用 progress 标签。
<h4>Disk usage</h4>

    <div>
        <label for="disk-c">C:</label>
    <meter id="disk-c" value="0.6"></meter>
    </div>

    <div>
    <label for="disk-d">D:</label>
    <meter id="dist-d" min="10" max="50" value="40"></meter>
    </div>
Enter fullscreen mode Exit fullscreen mode

替代文本

  • base 标签指定文档中所有相对 URL 的基准 URL 和/或目标 URL。一个文档中只能有一个 base 元素,并且必须位于 head 元素内。
<head>
    <base href="https://example.com/">
</head>

<img src="images/example.svg" alt="">
Enter fullscreen mode Exit fullscreen mode

就这样吧,希望你在这里找到了一些有用的信息。祝你平安,度过美好的一天 :)

文章来源:https://dev.to/sasscrafter/awesome-html-tags-and-attributes-339p
PREV
第一部分:命名约定 - 整洁代码的基础
NEXT
Node.js 架构模式及示例