📅 最后修改于: 2023-12-03 14:56:22.037000 🧑 作者: Mango
移动设备使用的移动浏览器有很多种，为了适应不同的移动设备，也为了提升用户体验，HTML 5 提供了很多用于移动视图的标记。
ViewPort 标签在移动设备上非常重要，它可以指定页面的宽度和缩放比例，以及显示页面的方式。添加此标签可以让你的网页适应不同的屏幕大小和分辨率。
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
在移动设备上，我们也可以使用 HTML 5 新的 Audio 和 Video 标签来播放音频和视频。
<video src="video.mpg" controls="controls"></video>
<audio src="music.mp3" controls="controls"></audio>
HTML 5 对移动设备的支持也包括了新的触摸事件。在移动设备上，我们可以用 touch 事件来代替传统的 click 事件。
<button ontouchstart="touchStart()" ontouchmove="touchMove()" ontouchend="touchEnd()">Touch Me</button>
HTML 5 还加入了很多新的表单输入类型，如 date、time、month、week、datetime、datetime-local、color 等等，这些输入类型不仅可以提升用户体验，还可以提供更精确、更正确的数据。
<input type="date">
<input type="time">
<input type="color">
HTML 5 新的 Canvas 标签可以让我们用 JavaScript 绘制图形、图像、动画以及一些复杂的效果。这是为移动设备准备的专业画布。
<canvas id="myCanvas"></canvas>
以上就是 HTML 5 主要用于移动视图的标记。这些标记能够让你的网页更适应不同的移动设备，并提供更好的用户体验。值得注意的是，不同的移动设备和浏览器支持的标记可能会有所不同，所以在使用这些标记之前，需要先对目标移动设备和浏览器进行了解和测试。