2020前端面试(基础篇1)
1.http和https的区别
http传输的数据都是未加密的，也就是明文的，网景公司设置了SSL协议来对http协议传输的数据进行加密处理，简单来说https协议是由http和ssl协议构建的可进行加密传输和身份认证的网络协议，比http协议的安全性更高。
主要的区别如下：
- Https协议需要ca证书，费用较高。
- http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
- 使用不同的链接方式，端口也不同，一般而言，http协议的端口为80，https的端口为443。
- http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。
2.如何理解html语义化
简单来说，用正确的标签做正确的事。
例如：段落用p标签、链接用a标签、无序列表用ul标签等等。
好处：
- 增强可读性，对开发者更友好，在没有 CSS 的情况下也能较好地呈现网页的内容结构与代码结构，便于团队的开发和维护。
- 有利于 SEO ，可以让搜索引擎爬虫更好地获取到更多有效信息，搜索引擎的爬虫依赖于标签来确定上下文和各个关键字的权重，有效提升网页的搜索量。
- 支持读屏软件，方便其他设备的解析，利于无障碍阅读，提高可访问性。
3.标准盒子模型和IE盒子模型有什么不同
标准盒子模型元素框的总宽度=margin-left * 2 + border-left * 2 + padding-left * 2 + width
标准盒子模型元素框的总高度=margin-top * 2 + border-top * 2 + padding-top * 2 + height
标准盒子模型 width = content的宽度
IE盒子模型宽度=margin-left * 2 + width
IE盒子模型高度=marin-top * 2 + height
IE盒子模型 width = content的宽度+border边框宽度(左右)+padding内边距(左右)
4.用css画一个三角形
<style>
.box{
width: 0;
height: 0;
border-top: 40px solid transparent;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 40px solid #ff0000;
}
</style>
<body>
<div class="box"></div>
</body>
5.1rem、1em、1vh、1px各自代表的含义？
| 单位 | 说明 |
|---|---|
| 1rem | rem是全部的长度都相对于根元素元素。通常做法是给html元素设置一个字体大小，然后其他元素的长度单位就为rem。 |
| 1em | 子元素字体大小的em是相对于父元素字体大小，元素的width/height/padding/margin用em的话是相对于该元素的font-size |
| 1vh | 全称是 Viewport Width 和 Viewport Height，视窗的宽度和高度，相当于 屏幕宽度和高度的 1%，不过，处理宽度的时候%单位更合适，处理高度的 话 vh 单位更好。 |
| 1px | px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。一般电脑的分辨率有{19201024}等不同的分辨率19201024。 前者是屏幕宽度总共有1920个像素,后者则是高度为1024个像素 |
1007
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
