现如今的页面越来越复杂，一个页面往往承载着大量的元素，最常见的就是一些电商页面，数以万计的商品列表是怎么保证渲染不卡顿的，大家在面对这种长列表渲染的场景下，一般都会采用分页或者虚拟列表来减缓页面一次性

网格布局（Grid）是最强大的 CSS 布局方案。 它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。

日常的开发模式 存在以下痛点。 对于这个问题，也有一些方案。 style 标签的 scoped 指令定义作用域，通过编译为该作用域所有标签生成唯一的属性。如图： 但是 react 并未给我们实现，我们可能会能通过其它方案来实现，如：约定 css class 命名规范(命名空间)…

我们在页面布局的时候，经常出现以下情况： 这个元素高度怎么没了？ 这两栏布局怎么没法自适应？ 这两个元素的间距怎么有点奇怪的样子？原因是元素之间相互的影响，这就涉及到了bfc概念

BFC到底是什么东西BFC，怎样触发BFC，BFC的规则，BFC解决了什么问题，一文搞懂，进来瞅瞅吧

在网页开发中，我们经常会遇到动态的改变某个元素样式的需求，在vue里如何实现呢？官网上其实写的很详细了，对象语法，数组语法等。我自己总结了在开发中，个人用的比较多的三种方式 这两种方式很像，区别在于，使用方法的时候，视图刷新，函数就会重新计算一遍值。计算属性，会把以前的值缓存起…

/deep/的意思大概为深入的，深远的。无意中看到css中有关于这种写法，开始没太注意 ，以为是组件css的写法，后来才发现不是。我们都知道Scoped CSS规范是Web组件产生不污染其他组件，也不被其他组件污染的CSS规范。这样在打包的时候会生成一个独一无二hash值，这样…