最近翻看张鑫旭大佬的博客，发现了一篇不错的文章，于是就把大佬的代码拷贝下来学习了下，作为多年前端的我居然看的不是很懂，自信息大大受打击了，于是把其中关键部分写出来，方便日后学习。

何为技巧，意指表现在文学、工艺、体育等方面的巧妙技能。代码作为一门现代高级工艺，推动着人类科学技术的发展，同时犹如文字一样承托着人类文化的进步。 每写好一篇文章，都会使用大量的写作技巧。烘托、渲染、悬念、铺垫、照应、伏笔、联想、想象、抑扬结合、点面结合、动静结合、叙议结合、情景…

1. 介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？ 2. box-sizing属性？ border-box：IE 传统盒子模型。设置元素的 height/width 属性指的是 content + border + padding 部分的高/宽 3. 对…

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

vite如何像Webpack那样拆包？ vite如何优雅增加环境变量？ vite打包时如何替换本地静态资源为CDN(OSS)资源？ vite对于有二级目录的线上环境，如何设置？

最近在网上看到 Tailwind Labs的实现的[换肤视频]，决定使用 Tailwind css 实现博客列表主题换肤。

1、不同视口的获取方法 2、JavaScript检测横竖屏 3、CSS检测横竖屏 4、meta标签属性设置 5、meta标签属性设置设置刘海屏&底部小黑条 设置安全区域与边界的距离 注：constan

三栏布局是左右两侧浮动，而中间宽度自适应不浮动做出的效果。 产生这种效果的原因是先加载main，而main是块级元素占据一整行，导致后面加载的两侧侧边栏被挤到了下行。 3.为两侧侧边栏添加负margin，用以调整位置，其中摆在左边的aside的margin-left为-100%…

响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局。传统的开发方式是PC端开发一套，手机端再开发一套，而使用响应式布局只要开发一套就够，缺点就是CSS比较重。下面是博客网站对不同设备适配后的结果，分别是iPhone5/SE,iphone6/7/8,iphone 6/7/8 p…