关于javascript:大厂前端面试考什么

设计思路如下：

存储的每个对象须要增加两个属性：别离是过期工夫和存储工夫。
利用一个属性保留零碎中目前所占空间大小，每次存储都减少该属性。当该属性值大于 1M 时，须要依照工夫排序零碎中的数据，删除一定量的数据保障可能存储下目前须要存储的数据。
每次取数据时，须要判断该缓存数据是否过期，如果过期就删除。

以下是代码实现，实现了思路，然而可能会存在 Bug，然而这种设计题个别是给出设计思路和局部代码，不会须要写出一个无问题的代码

class Store {constructor() {let store = localStorage.getItem('cache')
    if (!store) {
      store = {
        maxSize: 1024 * 1024,
        size: 0
      }
      this.store = store
    } else {this.store = JSON.parse(store)
    }
  }
  set(key, value, expire) {this.store[key] = {date: Date.now(),
      expire,
      value
    }
    let size = this.sizeOf(JSON.stringify(this.store[key]))
    if (this.store.maxSize < size + this.store.size) {console.log('超了 -----------');
      var keys = Object.keys(this.store);
      // 工夫排序
      keys = keys.sort((a, b) => {let item1 = this.store[a], item2 = this.store[b];
        return item2.date - item1.date;
      });
      while (size + this.store.size > this.store.maxSize) {let index = keys[keys.length - 1]
        this.store.size -= this.sizeOf(JSON.stringify(this.store[index]))
        delete this.store[index]
      }
    }
    this.store.size += size

    localStorage.setItem('cache', JSON.stringify(this.store))
  }
  get(key) {let d = this.store[key]
    if (!d) {console.log('找不到该属性');
      return
    }
    if (d.expire > Date.now) {console.log('过期删除');
      delete this.store[key]
      localStorage.setItem('cache', JSON.stringify(this.store))
    } else {return d.value}
  }
  sizeOf(str, charset) {
    var total = 0,
      charCode,
      i,
      len;
    charset = charset ? charset.toLowerCase() : '';
    if (charset === 'utf-16' || charset === 'utf16') {for (i = 0, len = str.length; i < len; i++) {charCode = str.charCodeAt(i);
        if (charCode <= 0xffff) {total += 2;} else {total += 4;}
      }
    } else {for (i = 0, len = str.length; i < len; i++) {charCode = str.charCodeAt(i);
        if (charCode <= 0x007f) {total += 1;} else if (charCode <= 0x07ff) {total += 2;} else if (charCode <= 0xffff) {total += 3;} else {total += 4;}
      }
    }
    return total;
  }
}

采纳 transform: scale()的形式，该办法用来定义元素的 2D 缩放转换：

transform: scale(0.5,0.5);

采纳 meta viewport 的形式

<meta name="viewport" content="width=device-width, initial-scale=0.5, minimum-scale=0.5, maximum-scale=0.5"/>

这样就能缩放到原来的 0.5 倍，如果是 1px 那么就会变成 0.5px。viewport 只针对于挪动端，只在挪动端上能力看到成果

HTTPS 要比 HTTPS 多了 secure 安全性这个概念，实际上，HTTPS 并不是一个新的应用层协定，它其实就是 HTTP + TLS/SSL 协定组合而成，而安全性的保障正是 SSL/TLS 所做的工作。

SSL

安全套接层（Secure Sockets Layer）

TLS

（传输层平安，Transport Layer Security）

当初支流的版本是 TLS/1.2, 之前的 TLS1.0、TLS1.1 都被认为是不平安的，在不久的未来会被齐全淘汰。

HTTPS 就是身披了一层 SSL 的 HTTP。

那么区别有哪些呢👇

HTTP 是明文传输协定，HTTPS 协定是由 SSL+HTTP 协定构建的可进行加密传输、身份认证的网络协议，比 HTTP 协定平安。
HTTPS 比 HTTP 更加平安，对搜索引擎更敌对，利于 SEO, 谷歌、百度优先索引 HTTPS 网页。
HTTPS 规范端口 443，HTTP 规范端口 80。
HTTPS 须要用到 SSL 证书，而 HTTP 不必。

我感觉记住以下两点 HTTPS 次要作用就行👇

对数据进行加密，并建设一个信息安全通道，来保障传输过程中的数据安全;
对网站服务器进行实在身份认证。

HTTPS 的毛病

证书费用以及更新保护。
HTTPS 升高肯定用户访问速度（实际上优化好就不是毛病了）。
HTTPS 耗费 CPU 资源，须要减少大量机器。

伪元素：在内容元素的前后插入额定的元素或款式，然而这些元素实际上并不在文档中生成。它们只在内部显示可见，但不会在文档的源代码中找到它们，因而，称为“伪”元素。例如：

p::before {content:"第一章：";}
p::after {content:"Hot!";}
p::first-line {background:red;}
p::first-letter {font-size:30px;}

伪类：将非凡的成果增加到特定选择器上。它是已有元素上增加类别的，不会产生新的元素。例如：

a:hover {color: #FF00FF}
p:first-child {color: red}

总结： 伪类是通过在元素选择器上加⼊伪类扭转元素状态，⽽伪元素通过对元素的操作进⾏对元素的扭转。

（1）SVG： SVG 可缩放矢量图形（Scalable Vector Graphics）是基于可扩大标记语言 XML 形容的 2D 图形的语言，SVG 基于 XML 就意味着 SVG DOM 中的每个元素都是可用的，能够为某个元素附加 Javascript 事件处理器。在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器可能主动重现图形。

其特点如下：

不依赖分辨率
反对事件处理器
最适宜带有大型渲染区域的应用程序（比方谷歌地图）
复杂度高会减慢渲染速度（任何适度应用 DOM 的利用都不快）
不适宜游戏利用

（2）Canvas： Canvas 是画布，通过 Javascript 来绘制 2D 图形，是逐像素进行渲染的。其地位产生扭转，就会从新进行绘制。

其特点如下：

依赖分辨率
不反对事件处理器
弱的文本渲染能力
可能以 .png 或 .jpg 格局保留后果图像
最适宜图像密集型的游戏，其中的许多对象会被频繁重绘

注：矢量图，也称为面向对象的图像或绘图图像，在数学上定义为一系列由线连贯的点。矢量文件中的图形元素称为对象。每个对象都是一个自成一体的实体，它具备色彩、形态、轮廓、大小和屏幕地位等属性。

单行文本溢出

overflow: hidden;            // 溢出暗藏
text-overflow: ellipsis;      // 溢出用省略号显示
white-space: nowrap;         // 规定段落中的文本不进行换行

多行文本溢出

overflow: hidden;            // 溢出暗藏
text-overflow: ellipsis;     // 溢出用省略号显示
display:-webkit-box;         // 作为弹性伸缩盒子模型显示。-webkit-box-orient:vertical; // 设置伸缩盒子的子元素排列形式：从上到下垂直排列
-webkit-line-clamp:3;        // 显示的行数

留神：因为下面的三个属性都是 CSS3 的属性，没有浏览器能够兼容，所以要在后面加一个-webkit- 来兼容一部分浏览器。

参考前端进阶面试题具体解答

以图片显示为例：

window.innerHeight 是浏览器可视区的高度；
document.body.scrollTop || document.documentElement.scrollTop 是浏览器滚动的过的间隔；
imgs.offsetTop 是元素顶部间隔文档顶部的高度（包含滚动条的间隔）；
内容达到显示区域的：img.offsetTop < window.innerHeight + document.body.scrollTop;

媒体查问由⼀个可选的媒体类型和零个或多个使⽤媒体性能的限度了样式表范畴的表达式组成，例如宽度、⾼度和颜⾊。媒体查问，增加⾃ CSS3，容许内容的出现针对⼀个特定范畴的输出设备⽽进⾏裁剪，⽽不用扭转内容自身，适宜 web ⽹⻚应答不同型号的设施⽽做出对应的响应适配。

媒体查问蕴含⼀个可选的媒体类型和满⾜ CSS3 标准的条件下，蕴含零个或多个表达式，这些表达式形容了媒体特色，最终会被解析为 true 或 false。如果媒体查问中指定的媒体类型匹配展现⽂档所使⽤的设施类型，并且所有的表达式的值都是 true，那么该媒体查问的后果为 true。那么媒体查问内的款式将会⽣效。

<!-- link 元素中的 CSS 媒体查问 --> 
<link rel="stylesheet" media="(max-width: 800px)" href="example.css" /> 
<!-- 样式表中的 CSS 媒体查问 --> 
<style> 
@media (max-width: 600px) {.facet_sidebar {     display: none;} }
</style>

简略来说，应用 @media 查问，能够针对不同的媒体类型定义不同的款式。@media 能够针对不同的屏幕尺寸设置不同的款式，特地是须要设置设计响应式的页面，@media 是十分有用的。当重置浏览器大小的过程中，页面也会依据浏览器的宽度和高度从新渲染页面。

在线的状况下，浏览器发现 html 头部有 manifest 属性，它会申请 manifest 文件，如果是第一次拜访页面，那么浏览器就会依据 manifest 文件的内容下载相应的资源并且进行离线存储。如果曾经拜访过页面并且资源曾经进行离线存储了，那么浏览器就会应用离线的资源加载页面，而后浏览器会比照新的 manifest 文件与旧的 manifest 文件，如果文件没有产生扭转，就不做任何操作，如果文件扭转了，就会从新下载文件中的资源并进行离线存储。
离线的状况下，浏览器会间接应用离线存储的资源。

产生乱码的起因：

网页源代码是 gbk 的编码，而内容中的中文字是 utf-8 编码的，这样浏览器关上即会呈现 html 乱码，反之也会呈现乱码；
html网页编码是 gbk，而程序从数据库中调出出现是utf-8 编码的内容也会造成编码乱码；
浏览器不能自动检测网页编码，造成网页乱码。

解决办法：

应用软件编辑 HTML 网页内容；
如果网页设置编码是gbk，而数据库贮存数据编码格局是UTF-8，此时须要程序查询数据库数据显示数据后退程序转码；
如果浏览器浏览时候呈现网页乱码，在浏览器中找到转换编码的菜单进行转换。

CSS 工程化是为了解决以下问题：

宏观设计：CSS 代码如何组织、如何拆分、模块构造怎么设计？
编码优化：怎么写出更好的 CSS？
构建：如何解决我的 CSS，能力让它的打包后果最优？
可维护性：代码写完了，如何最小化它后续的变更老本？如何确保任何一个共事都能轻松接手？

以下三个方向都是时下比拟风行的、普适性十分好的 CSS 工程化实际：

预处理器：Less、Sass 等；
重要的工程化插件：PostCss；
Webpack loader 等。

基于这三个方向，能够衍生出一些具备典型意义的子问题，这里咱们一一来看：

（1）预处理器：为什么要用预处理器？它的呈现是为了解决什么问题？

预处理器，其实就是 CSS 世界的“轮子”。预处理器反对咱们写一种相似 CSS、但理论并不是 CSS 的语言，而后把它编译成 CSS 代码：那为什么写 CSS 代码写得好好的，偏偏要转去写“类 CSS”呢？这就和原本用 JS 也能够实现所有性能，但最初却写 React 的 jsx 或者 Vue 的模板语法一样——为了爽！要想晓得有了预处理器有多爽，首先要晓得的是传统 CSS 有多不爽。随着前端业务复杂度的进步，前端工程中对 CSS 提出了以下的诉求：

宏观设计上：咱们心愿能优化 CSS 文件的目录构造，对现有的 CSS 文件实现复用；
编码优化上：咱们心愿能写出构造清晰、扼要易懂的 CSS，须要它具备高深莫测的嵌套层级关系，而不是无差别的一铺到底写法；咱们心愿它具备变量特色、计算能力、循环能力等等更强的可编程性，这样咱们能够少写一些无用的代码；
可维护性上：更强的可编程性意味着更优质的代码构造，实现复用意味着更简略的目录构造和更强的拓展能力，这两点如果能做到，天然会带来更强的可维护性。

这三点是传统 CSS 所做不到的，也正是预处理器所解决掉的问题。预处理器广泛会具备这样的个性：

嵌套代码的能力，通过嵌套来反映不同 css 属性之间的层级关系；
反对定义 css 变量；
提供计算函数；
容许对代码片段进行 extend 和 mixin；
反对循环语句的应用；
反对将 CSS 文件模块化，实现复用。

（2）PostCss：PostCss 是如何工作的？咱们在什么场景下会应用 PostCss？

它和预处理器的不同就在于，预处理器解决的是类 CSS，而 PostCss 解决的就是 CSS 自身。Babel 能够将高版本的 JS 代码转换为低版本的 JS 代码。PostCss 做的是相似的事件：它能够编译尚未被浏览器广泛支持的先进的 CSS 语法，还能够主动为一些须要额定兼容的语法减少前缀。更强的是，因为 PostCss 有着弱小的插件机制，反对各种各样的扩大，极大地强化了 CSS 的能力。

PostCss 在业务中的应用场景十分多：

进步 CSS 代码的可读性：PostCss 其实能够做相似预处理器能做的工作；
当咱们的 CSS 代码须要适配低版本浏览器时，PostCss 的 Autoprefixer 插件能够帮忙咱们主动减少浏览器前缀；
容许咱们编写面向未来的 CSS：PostCss 可能帮忙咱们编译 CSS next 代码；

（3）Webpack 能解决 CSS 吗？如何实现？ Webpack 能解决 CSS 吗：

Webpack 在裸奔的状态下，是不能解决 CSS 的，Webpack 自身是一个面向 JavaScript 且只能解决 JavaScript 代码的模块化打包工具；
Webpack 在 loader 的辅助下，是能够解决 CSS 的。

如何用 Webpack 实现对 CSS 的解决：

Webpack 中操作 CSS 须要应用的两个要害的 loader：css-loader 和 style-loader
留神，答出“用什么”有时候可能还不够，面试官会狐疑你是不是在背答案，所以你还须要理解每个 loader 都做了什么事件：
- css-loader：导入 CSS 模块，对 CSS 代码进行编译解决；
- style-loader：创立 style 标签，把 CSS 内容写入标签。

在理论应用中，css-loader 的执行程序肯定要安顿在 style-loader 的后面。因为只有实现了编译过程，才能够对 css 代码进行插入；若提前插入了未编译的代码，那么 webpack 是无奈了解这坨货色的，它会无情报错。

strong 标签有语义，是起到减轻语气的成果，而 b 标签是没有的，b 标签只是一个简略加粗标签。b 标签之间的字符都设为粗体，strong 标签增强字符的语气都是通过粗体来实现的，而搜索引擎更偏重 strong 标签。
title 属性没有明确意义只示意是个题目，H1 则示意档次明确的题目，对页面信息的抓取有很大的影响
i 内容展现为斜体，em 示意强调的文本

新增各种 CSS 选择器（: not(.input)：所有 class 不是“input”的节点）
圆角（border-radius:8px）
多列布局（multi-column layout）
暗影和反射（Shadoweflect）
文字特效（text-shadow）
文字渲染（Text-decoration）
线性突变（gradient）
旋转（transform）
减少了旋转, 缩放, 定位, 歪斜, 动画, 多背景

通过批改某个属性值出现的内容就能够被替换的元素就称为“替换元素”。

替换元素除了内容可替换这一个性以外，还有以下个性：

内容的外观不受页面上的 CSS 的影响：用业余的话讲就是在款式体现在 CSS 作用域之外。如何更改替换元素自身的外观须要相似 appearance 属性，或者浏览器本身裸露的一些款式接口。
有本人的尺寸：在 Web 中，很多替换元素在没有明确尺寸设定的状况下，其默认的尺寸（不包含边框）是 300 像素×150 像素，如
在很多 CSS 属性上有本人的一套体现规定：比拟具备代表性的就是 vertical-align 属性，对于替换元素和非替换元素，vertical-align 属性值的解释是不一样的。比方说 vertical-align 的默认值的 baseline，很简略的属性值，基线之意，被定义为字符 x 的下边缘，而替换元素的基线却被硬生生定义成了元素的下边缘。
所有的替换元素都是内联程度元素：也就是替换元素和替换元素、替换元素和文字都是能够在一行显示的。然而，替换元素默认的 display 值却是不一样的，有的是 inline，有的是 inline-block。

替换元素的尺寸从内而外分为三类：

固有尺寸： 指的是替换内容本来的尺寸。例如，图片、视频作为一个独立文件存在的时候，都是有着本人的宽度和高度的。
HTML 尺寸： 只能通过 HTML 原生属性扭转，这些 HTML 原生属性包含的 width 和 height 属性、的 size 属性。
CSS 尺寸： 特指能够通过 CSS 的 width 和 height 或者 max-width/min-width 和 max-height/min-height 设置的尺寸，对应盒尺寸中的 content box。

这三层构造的计算规定具体如下：
（1）如果没有 CSS 尺寸和 HTML 尺寸，则应用固有尺寸作为最终的宽高。
（2）如果没有 CSS 尺寸，则应用 HTML 尺寸作为最终的宽高。
（3）如果有 CSS 尺寸，则最终尺寸由 CSS 属性决定。
（4）如果“固有尺寸”含有固有的宽高比例，同时仅设置了宽度或仅设置了高度，则元素仍然依照固有的宽高比例显示。
（5）如果下面的条件都不合乎，则最终宽度体现为 300 像素，高度为 150 像素。
（6）内联替换元素和块级替换元素应用下面同一套尺寸计算规定。

一、无继承性的属性

display：规定元素应该生成的框的类型
文本属性：
vertical-align：垂直文本对齐
text-decoration：规定增加到文本的装璜
text-shadow：文本暗影成果
white-space：空白符的解决
unicode-bidi：设置文本的方向
盒子模型的属性：width、height、margin、border、padding
背景属性：background、background-color、background-image、background-repeat、background-position、background-attachment
定位属性：float、clear、position、top、right、bottom、left、min-width、min-height、max-width、max-height、overflow、clip、z-index
生成内容属性：content、counter-reset、counter-increment
轮廓款式属性：outline-style、outline-width、outline-color、outline
页面款式属性：size、page-break-before、page-break-after
声音款式属性：pause-before、pause-after、pause、cue-before、cue-after、cue、play-during

二、有继承性的属性

字体系列属性
font-family：字体系列

font-weight：字体的粗细
font-size：字体的大小
font-style：字体的格调
文本系列属性
text-indent：文本缩进
text-align：文本程度对齐
line-height：行高
word-spacing：单词之间的间距
letter-spacing：中文或者字母之间的间距
text-transform：管制文本大小写（就是 uppercase、lowercase、capitalize 这三个）
color：文本色彩
元素可见性
visibility：管制元素显示暗藏
列表布局属性
list-style：列表格调，包含 list-style-type、list-style-image 等
光标属性
cursor：光标显示为何种状态

浏览器会把 inline 内联元素间的空白字符（空格、换行、Tab 等）渲染成一个空格。为了好看，通常是一个 <li> 放在一行，这导致 <li> 换行后产生换行字符，它变成一个空格，占用了一个字符的宽度。

解决办法：

（1）为 <li> 设置 float:left。有余：有些容器是不能设置浮动，如左右切换的焦点图等。

（2）将所有 <li> 写在同一行。有余：代码不美观。

（3）将 <ul> 内的字符尺寸间接设为 0，即 font-size:0。有余：<ul>中的其余字符尺寸也被设为 0，须要额定从新设定其余字符尺寸，且在 Safari 浏览器仍然会呈现空白距离。

（4）打消 <ul> 的字符距离 letter-spacing:-8px，有余：这也设置了 <li> 内的字符距离，因而须要将 <li> 内的字符距离设为默认 letter-spacing:normal。

（1）渐进加强（progressive enhancement）：次要是针对低版本的浏览器进行页面重构，保障根本的性能状况下，再针对高级浏览器进行成果、交互等方面的改良和追加性能，以达到更好的用户体验。（2）优雅降级 graceful degradation：一开始就构建残缺的性能，而后再针对低版本的浏览器进行兼容。

两者区别：

优雅降级是从简单的现状开始的，并试图缩小用户体验的供应；而渐进加强是从一个十分根底的，可能起作用的版本开始的，并在此基础上一直裁减，以适应将来环境的须要；
降级（性能衰竭）意味着往回看，而渐进加强则意味着往前看，同时保障其根基处于平安地带。

“优雅降级”观点认为应该针对那些最高级、最欠缺的浏览器来设计网站。而将那些被认为“过期”或有性能缺失的浏览器下的测试工作安顿在开发周期的最初阶段，并把测试对象限定为支流浏览器（如 IE、Mozilla 等）的前一个版本。在这种设计范例下，旧版的浏览器被认为仅能提供“简陋却不妨 (poor, but passable)”的浏览体验。能够做一些小的调整来适应某个特定的浏览器。但因为它们并非咱们所关注的焦点，因而除了修复较大的谬误之外，其它的差别将被间接疏忽。

“渐进加强”观点则认为应关注于内容自身。内容是建设网站的诱因，有的网站展现它，有的则收集它，有的寻求，有的操作，还有的网站甚至会蕴含以上的种种，但相同点是它们全都波及到内容。这使得“渐进加强”成为一种更为正当的设计范例。这也是它立刻被 Yahoo 所驳回并用以构建其“分级式浏览器反对 (Graded Browser Support)”策略的起因所在。

以 iPhone XS 为例，当写 CSS 代码时，针对于单位 px，其宽度为 414px & 896px，也就是说当赋予一个 DIV 元素宽度为 414px，这个 DIV 就会填满手机的宽度；

而如果有一把尺子来理论测量这部手机的物理像素，理论为 1242*2688 物理像素；通过计算可知，1242/414=3，也就是说，在单边上，一个逻辑像素 = 3 个物理像素，就说这个屏幕的像素密度为 3，也就是常说的 3 倍屏。

对于图片来说，为了保障其不失真，1 个图片像素至多要对应一个物理像素，如果原始图片是 500300 像素，那么在 3 倍屏上就要放一个 1500900 像素的图片能力保障 1 个物理像素至多对应一个图片像素，能力不失真。当然，也能够针对所有屏幕，都只提供最高清图片。尽管低密度屏幕用不到那么多图片像素，而且会因为下载多余的像素造成带宽节约和下载提早，但从后果上说能保障图片在所有屏幕上都不会失真。

还能够应用 CSS 媒体查问来判断不同的像素密度，从而抉择不同的图片:

my-image {background: (low.png); }
@media only screen and (min-device-pixel-ratio: 1.5) {#my-image { background: (high.png); }
}

有空格时会有间隙，能够删除空格解决；
margin正值时，能够让 margin 应用负值解决；
应用 font-size 时，可通过设置 font-size:0、letter-spacing、word-spacing 解决；

（1）解释型语言
应用专门的解释器对源程序逐行解释成特定平台的机器码并立刻执行。是代码在执行时才被解释器一行行动静翻译和执行，而不是在执行之前就实现翻译。解释型语言不须要当时编译，其间接将源代码解释成机器码并立刻执行，所以只有某一平台提供了相应的解释器即可运行该程序。其特点总结如下

解释型语言每次运行都须要将源代码解释称机器码并执行，效率较低；
只有平台提供相应的解释器，就能够运行源代码，所以能够不便源程序移植；
JavaScript、Python 等属于解释型语言。

（2）编译型语言
应用专门的编译器，针对特定的平台，将高级语言源代码一次性的编译成可被该平台硬件执行的机器码，并包装成该平台所能辨认的可执行性程序的格局。在编译型语言写的程序执行之前，须要一个专门的编译过程，把源代码编译成机器语言的文件，如 exe 格局的文件，当前要再运行时，间接应用编译后果即可，如间接运行 exe 文件。因为只需编译一次，当前运行时不须要编译，所以编译型语言执行效率高。其特点总结如下：

一次性的编译成平台相干的机器语言文件，运行时脱离开发环境，运行效率高；
与特定平台相干，个别无奈移植到其余平台；
C、C++ 等属于编译型语言。

两者次要区别在于： 前者源程序编译后即可在该平台运行，后者是在运行期间才编译。所以前者运行速度快，后者跨平台性好。

关于javascript:大厂前端面试考什么

基于 Localstorage 设计一个 1M 的缓存零碎，须要实现缓存淘汰机制

画一条 0.5px 的线

介绍一下 HTTPS 和 HTTP 区别

伪元素和伪类的区别和作用？

Canvas 和 SVG 的区别

单行、多行文本溢出暗藏

如何判断元素是否达到可视区域

对媒体查问的了解？

浏览器是如何对 HTML5 的离线贮存资源进行治理和加载？

浏览器乱码的起因是什么？如何解决？

对 CSS 工程化的了解

title 与 h1 的区别、b 与 strong 的区别、i 与 em 的区别？

CSS3 中有哪些新个性

替换元素的概念及计算规定

CSS 中可继承与不可继承属性有哪些

li 与 li 之间有看不见的空白距离是什么起因引起的？如何解决？

渐进加强和优雅降级之间的区别

什么是物理像素，逻辑像素和像素密度，为什么在挪动端开发时须要用到 @3x, @2x 这种图片？

display:inline-block 什么时候会显示间隙？

解释性语言和编译型语言的区别

Just My Socks（注册教程内含优惠码）

关于javascript:大厂前端面试考什么

基于 Localstorage 设计一个 1M 的缓存零碎，须要实现缓存淘汰机制

画一条 0.5px 的线

介绍一下 HTTPS 和 HTTP 区别

伪元素和伪类的区别和作用？

Canvas 和 SVG 的区别

单行、多行文本溢出暗藏

如何判断元素是否达到可视区域

对媒体查问的了解？

浏览器是如何对 HTML5 的离线贮存资源进行治理和加载？

浏览器乱码的起因是什么？如何解决？

对 CSS 工程化的了解

title 与 h1 的区别、b 与 strong 的区别、i 与 em 的区别？

CSS3 中有哪些新个性

替换元素的概念及计算规定

CSS 中可继承与不可继承属性有哪些

li 与 li 之间有看不见的空白距离是什么起因引起的？如何解决？

渐进加强和优雅降级之间的区别

什么是物理像素，逻辑像素和像素密度，为什么在挪动端开发时须要用到 @3x, @2x 这种图片？

display:inline-block 什么时候会显示间隙？

解释性语言和编译型语言的区别

Just My Socks（注册教程 内含优惠码）

Just My Socks（注册教程内含优惠码）