$\color{FF0000}{PS：对于是否是真的会影响性能，下面做一个实验。}$ $\color{FF0000}{貌似对css的计算是有些许影响，但是最终浏览器的总时间并没有太大出入(多次的平均值)。}$ PS：记得chrome有一个timline选项的，但是找不到了，不知…

开发每一张网页都离不开布局排版，基于良好布局排版打下基础，才能使后续的开发更顺利。今时不同往日，现代CSS属性能更好地快速实现各种布局排版，节约更多时间去摸鱼

多行文本展开收起是一个很常见的交互， 如下图演示 实现这一类布局和交互难点主要有以下几点 位于多行文本右下角的“展开收起”按钮 “展开”和“收起”两种状态的切换 当文本不超过指定行数时，不显示“展开收

本文主要介绍在css中应用设计模式的思想，首先通过分析页面的结构去构想划分css功能模块和命名的思路，接着去分析和总结社区提出现有的设计模式思想，然后根据它们的思想去总结出使用css设计模式的必要性

在实际 Web 开发过程中，总会遇到各种各样的布局。有公司同事问我这样一种布局有没有什么好的实现方式，就是一种在活动充值页非常普遍的优惠券效果，如下 首先，碰到这类布局的最佳实现肯定是mask遮罩。关于遮罩，可以看一下CSS3 Mask 安利报告。这里简单介绍一下 这里的遮罩图…

说起 CSS 命名规范，大家应该都很熟悉，或者应该听说过 BEM 。BEM 是由 Yandex 团队提出的一种 CSS Class 命名方法，旨在帮助开发人员创建更好的且结构一致的 CSS 模块。 BEM 将页面的类名分为块（Block）、元素（Element）、修饰符（Mod…

48张图带你从0到1掌握flex布局方式。 需要本文的Xmind导图的话，移步公众号--前端UpUp,回复flex关键字即可。 从上面图来看，我们将flex布局分为两部分讲，轴和容器。 打个预防针，flex布局涉及到12个CSS属性，父容器,子容器各6个。 接下来先梳理常见的属…

1. less 简介 2. 嵌套规则 3. 变量 4. 混合（mixins） 只有一个值，把值赋给第一个，两个值，赋给第一个和第二个...... 5. 运算 6. 命名空间 7. 引入 8. !important 9. 条件表达式 10. 循环 11. 合并属性 12. 函数库

？？？啥玩意？？？去他电脑上看了一下才发现是安全软件的那个展示电脑使用情况的悬浮球，WTF！！你见过哪个Linux有这悬浮球的？你咋不让我再给你整一只瑞星小狮子在旁边给你跳舞呢？？算了还是别说了，说了真让我做怎么搞.... 项目使用的是vue框架，所以demo都是在vue环境下…