2025-03-29 14:35:49 +08:00

3.1 KiB
Raw Blame History

html 5

语义化标签

针对搜索引擎优化

<header>
  头部标签
</header>

<nav>
  导航标签
</nav>

<article>
  内容标签
</article>

<section>
  章节
</section>

<aside>
  侧边栏
</aside>

<footer>
  尾部
</footer>

多媒体标签

video

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  <source src="movie.webm" type="video/webm">
您的浏览器不支持 video 标签。
</video>
  • 不支持 video 标签的旧浏览器会显示标签中间的提示文本
属性 描述
autoplay autoplay 如果出现该属性则视频在就绪后马上播放。谷歌浏览器需要添加muted来解决自动播放问题。
controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性,则当媒介文件完成播放后再次开始播放。
preload preload 如果出现该属性,则视频在页面加载时进行加载,并预备播放。 如果使用 "autoplay",则忽略该属性。
src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。
muted bool 网页中的音频是否静音如果设置音频将被初始化为静音其默认值为false表示播放视频时将播放音频。muted="muted"

audio

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
  您的浏览器不支持 audio 元素。
</audio>
属性 描述
autoplay autoplay 如果出现该属性,则音频在就绪后马上播放。谷歌浏览器支持
controls controls 如果出现该属性,则向用户显示控件,比如播放按钮。
preload preload 如果出现该属性,则音频在页面加载时进行加载,并预备播放。 如果使用 "autoplay",则忽略该属性。
src url 要播放的音频的 URL。

input 新增类型

email url number time date week month tel search color

  • tel 在移动端会弹出数字键盘

表单属性

  • required="required"
  • placeholder="提示文本"
  • autocomplete="on | off" 自动补全, 为了保护隐私需要关掉
  • multiple="multiple" file类型多个文件提交
  • disable