写在前面算是一个总结，主要学习材料是《HF》。这本书的好处在于十分的详实，把基础给打的很透很扎实。之前还看过CS50的课，那个课的优势在于给你一种思维，方便理解整个是如何运作的，但进度很快，讲得比较抽象。还跟着b站的课程学了一点，这个课主要 ...

image.png 选择器的优先级 CSS标准用一个三元组 (a, b, c) 来构成一个复杂选择器的优先级。 id选择器的数目记为a； 伪类选择器和class选择器的数目记为b； 伪元素选择器和标签选择器数目记为c； “*” 不影响优先 ...

伪元素和伪类 说到这个，我们先回顾一下，伪类选择器和伪元素选择器，老版的浏览器没有严格区分下面 2 种写法。 a:after{} a::after{} 在新的标准中，单冒号(:)用于 CSS3 伪类，双冒号(::)用于 CSS3 伪元素，我 ...

这是我第16篇简书。 整体思路： 性能优化是什么? 从用户角度来看，什么才是好的页面？一个是页面加载的很快，另一个是页面使用起来很流畅。 那么对应到前端开发的角度，性能优化可以对应分为两个方向：页面加载时间跟页面运行效率。 从浏览器打开到页 ...

本文目录： 1.Sass、LESS和Stylus的基本语法 2.变量（Variables） 3.作用域（Scope） 4.混合(Mixins) 5.嵌套（Nesting） 6.继承（Inheritance） 7.颜色函数 8.导入（Impo ...

很多人想让我给他们推荐有关CSS部分的教程，或者问我如何学习CSS。我也看到很多人对CSS的部分内容感到困惑，一部分原因是由于对语言的过时认识。鉴于CSS在过去几年中发生了相当大的变化，这是一个更新知识的好时机。即使CSS只是你所做工作的一 ...

微信订阅号：Rabbit_svip 在选择器这个知识点中，ID选择器和类选择器（class）是最常见的。但因为常见，所以也常常会忽略很多非主线的知识点。比如【一本正经】如何用CSS选择符(数字开头) 杀死队友 目录 ID选择器的完整性 常 ...

实现样式： 1、鼠标移入后，鼠标样式图标变为“锤子”。 2、用户砸金蛋，锤子简单的扬起效果。 3、砸碎金蛋，显示内容。 分析实现步骤： 1、在html中插入一颗金蛋 找一张静态图片或带一点效果的动态图，直接放入img标签即可。 2、鼠标移入 ...

为什么Flex box跟Grid box的是以start、end为排列规则，而不是常规的top 、right 、bottom 跟left？ 现在各位看官有答案了吗？ 因为上一篇中有提到过CSS 逻辑属性的变革，从物理概念跳跃到了逻辑概念，也 ...

CSS权重 类型选择符的权重为：0001 类(class)选择符的权重为：0010 ID选择符的权重为：0100 子选择符(E>F)的权重为：0000 属性选择符的权重为：0010 伪类选择符的权重为：0010 伪元素选择符的权重为：000 ...