前端面试题总结:
1. 你是如何理解语义化的?
- 语义化,顾名思义,就是你写的HTML结构,是用相对应的有一定语义的英文字母(标签)表示的,标记的,因为HTML本身就是标记语言。不仅对自己来说,容易阅读,书写。别人看你的代码和结构也容易理解,甚至对一些不是做网页开发的人来说,也容易阅读。那么,我们以后再开发的过程中,一定要注意了,尽量使用官方的有语义的标签,不要再使用一堆无意义的标签去堆你的结构。
- 语义化,也无非就是自己在使用标签的时候多使用有英文语义的标签,比如h标签,在HTML中就是就是用来定义标题,还有p标签,英文是paragraph段落,table表格标签,等等。
2. meta viewport 是做什么的?怎么写?
- 移动端浏览器通常都在一个比屏幕更宽的虚拟窗口中渲染页面,这个虚拟窗口就是viewport,目的是正常展示没有做移动端适配的网页,可以让他们完整的展现给用户。我们有时用移动设备访问桌面版网页就会看到一个横向滚动条,这里可显示区域的宽度就是viewport的宽度。
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
该meta标签的作用是让当前viewport的宽度等于设备的宽度,同时不允许用户手动缩放。当然maximum-scale=1.0, user-scalable=0不是必需的,是否允许用户手动播放根据网站的需求来定,但把width设为width-device基本是必须的,这样能保证不会出现横向滚动条。
- meta viewport 的6个属性:
width 设置layout viewport 的宽度,为一个正整数,或字符串”width-device” initial-scale 设置页面的初始缩放值,为一个数字,可以带小数 minimum-scale 允许用户的最小缩放值,为一个数字,可以带小数 maximum-scale 允许用户的最大缩放值,为一个数字,可以带小数 height 设置layout viewport 的高度,这个属性并不重要,很少使用 user-scalable 是否允许用户进行缩放,值为”no”或”yes”, no 代表不允许,yes代表允许
3.你用过哪些 HTML 5 标签?
<article> 定义独立的内容 <aside> 定义页面内容之外的内容 <audio> 定义声音内容 <bdi> 定义文本的文本方向,使其脱离其周围文本的方向设置 <canvas> 定义图形 <command> 定义命令按钮 <datalist> 定义下拉列表 <details> 定义元素的细节 <embed> 定义外部交互内容或插件 <figcaption> 定义figure元素的标题 <figure> 定义媒介内容的分组,以及他们的标题 <footer> 定义section或page的页脚 <header> 定义section或page的页眉 <hgroup> 定义有关文档中的section信息 <keygen> 定义生成密钥 <mark> 定义有记号的文本 <meter> 定义预定义范围内的度量 <nav> 定义导航链接 <output> 定义输出的一些类型 <progress> 定义任何类型的任务的进度 <rp> 定义若浏览器不支持ruby元素显示的内容 <rt> 定义ruby注释的解释 <ruby> 定义ruby注释 <section> 定义section <source> 定义媒介源 <summary> 定义details元素的标题 <time> 定义日期/时间 <track> 定义用在媒体播放器中的文本轨道 <video> 定义视频
4. H5 是什么?
H5是HTML5的简称,就是“HTML”的第5个版本,也就是第5个版本的超文本标记语言。
原文:https://www.cnblogs.com/muzidaitou/p/12541470.html