flex布局大家应该已经运用的炉火纯青了，相信在日常开发中大家和我一样不管遇到什么都是flex一把搜哈。直到我遇到grid，才发现有些场景下，grid更加方便。

因为之前做一个页面出现了很多三角，开始直接用图片感觉并不是很好用，看着总是怪怪的颜色还很难调整的跟背景一样，就搜了一波代码直接用上了，事后想了一下感觉不知道具体原理是什么，很奇怪为什么边框能设置成三角的样式。于是搜了一波原理整理如下 因为很少用到很粗的边框，而且90%的情况下我…

看了此书才发现，以前的我懂的 css只是皮毛，原来它可以如此强大，47个案例真的是干货满满，相信对每一个前端都是值得一读的一本书。

看了此书才发现，以前的我懂的 css只是皮毛，原来它可以如此强大，47个案例真的是干货满满，相信对每一个前端都是值得一读的一本书。

Grid 布局即网格布局，是一种新的 CSS 布局模型，比较擅长将一个页面划分为几个主要区域，以及定义这些区域的大小、位置、层次等关系。号称是最强大的的 CSS 布局方案！！

前言 针对 CSS 优先级，我们的认知可能是这样：内联、CSS各种选择器、!important， 你是否遇到过优先级覆盖成本太高、优先级无法覆盖等情况？本文将带你重新认识 CSS 优先级。

一、需求场景 最近做项目时使用到响应式布局，页面的列表内容宽度随着浏览器窗口的变大而变大，并且列表页面主要是图片+标题，需求又要保证图片的等比例缩放。因此就引发了如何在宽度改变的情况下，保持图片高度的

display 设置了 none 属性会隐藏元素，且其位置也不会被保留下来，所以会触发浏览器渲染引擎的回流和重绘。 不会，因为 BFC 是页面中一个独立的隔离容器，其内部的元素不会与外部的元素相互影响，比如两个 div，上面的 div 设置了 float，那么如果下面的元素不是…

渲染树被绘制到画布上的顺序是根据层叠上下文来描述的。层叠上下文可以包含更多的层叠上下文。从父层叠上下文的角度来看，层叠上下文是原子的；其他层叠上下文中