# HTML
# 1、说一下对HTML语义化的理解?
语义化就是选择与语义相符合的标签，使代码语义化，这样不仅便于开发者进行阅读，同时也能维护和写出更优雅的代码，还能够让搜索引擎和浏览器等工具更好的解析。
通俗的讲语义化就是让正确的标签做正确的事情，比如段落用p标签，头部用header标签，主要内容main标签，侧边栏用aside标签等等。
更新-----语义化标签：header,footer,nav,main,article,section,aside,
html5的语义化指的是合理正确的使用语义化的标签来创建页面结构，如header,footer,nav,从标签上即可可以直观的知道这个标签的作用
- 优点
- 代码结构清晰，易于阅读，有利开发和维护
- 方便其它设备解析（如屏幕阅读器）根据语义渲染网页
- 有利于搜索引擎优化（seo），搜索引擎爬虫会根据不同的标签来赋予不同的权重
# 2、meta viewport
- 将视口大小设置为可视区域的大小
什么是视口
- 视口简单理解就是可视区域大小
- 在pc端，视口大小就是浏览器窗口可视区域的大小
- 在移动端，视口大小并不等于窗口大小，移动端视口宽度被人为定义为了980
为什么移动端视口宽度是980而不是其他的值
- 因为过去网页的版心都是980的，为了能够让网页在移动端完美的展示，所以将手机视口的大小定义为了980。
移动端自动将视口宽度设置为980带来的问题
虽然移动端自动将视口宽度设置980之后让我们可以很完美的看到整个网页，但由于移动端的物理尺寸（设备宽度）是远远小于视口宽度的，所以为了能够在较小的范围内看到视口中所有的内容，那么久必须将内容缩小。
但是缩小后用户看到的是一个缩小版的整个页面，字体，图标和内容等等都非常小，想要点击或者查看都需要去放大页面进行操作，放大页面之后就会出现横向滚动条，对用户体验来说非常不友好。
- 如何保证在移动端不自动缩放网页尺寸
通过meta设置视口大小
<meta name="viewport" content="width=device-width, initial-scale=1.0">
viewport是指web页面上的用户的可视区域。
meta标签的属性：
width=device-width 设置视口宽度等于设备的宽度
initial-scale=1.0 初始缩放笔记，1不缩放
maximum-scale:允许用户缩放到的最大比例
minimum-scale:允许用户缩放到的最小比例
user-scalable:用户是否可以手动缩放