HTML

143 阅读2分钟

常用语义化标签

  • <article> 表示文档、页面、应用或网站中的独立结构。可以嵌套使用代表和外层相关的结构。如嵌套部分代表评论外层为评论的文章。
  • <section> 文档中的独立部分
  • <aside> 表示一个和其余页面内容几乎无关的部分,通常表现为侧边栏或者标注框
  • <main> 文章或应用的主体部分。辅助功能技术会优先访问,浏览器的阅读器模式会优先阅读
  • <header> 通常包含一组介绍性的或是辅助导航的实用元素。它可能包含一些标题元素,但也可能包含其他元素,比如 Logo、搜索框、作者名称,等等
  • <nav> 提供导航链接。导航部分的常见示例是菜单,目录和索引。
  • <footer> 示最近一个章节内容或者根节点元素的页脚。一个页脚通常包含该章节作者、版权数据或者与文档相关的链接等信息
  • <code> 计算机代码
  • <var> 表示数学表达式或编程上下文中的变量名称
  • <h1> – <h6> 标题
  • <hr> 分隔内容
  • <p> 段落

其他

<head> 文档相关的配置信息(元数据)

  • <title> 浏览器的标题栏或标签页
  • <link> 外部资源链接元素
  • <style> 样式
  • <script> 可执行脚本
  • <noscript> 脚本类型不受支持或者当前在浏览器中关闭了脚本显示元素信息

<link>外部资源链接元素

  • href 外部资源路径
  • rel 资源关系与文档之间的关系 关系列表 rel设置为preload预加载
  • type 资源类型
  • media 满足媒体条件的情况下才被加载
  • as

<meta> 文档级元数据元素

  • name
  • http-equiv
    • content-security-policy
    • content-type
    • default-style
    • refresh
  • content http-equivname 属性的值

<input>

弹出相应的键盘type

  • email
  • password
  • number
  • file
    • accept 接受的MIME 类型
    • multiple 多选
    • capture user 前置摄像头和/或麦克风 environment后置摄像头和/或麦克风 缺少用户选择
    • HTMLInputElement.files获取文件
  • text
  • tel
  • url

表签属性

  • data-* 小写 HTMLElement.dataset获取
  • contenteditable 是否可编辑