通过css类分别定义菜单的展开和关闭状态，通过js添加或删除class来达到动态展开与关闭的效果
通过css3实现loading效果，总有一款适合你，赶紧收藏起来!
CSS 伪元素和伪类是用于选择和操作文档中特定元素的特定部分或状态的工具。尽管它们在语法上和功能上有相似之处，但它们的用途和实现是不同的。以下是对它们的详细解释：
检测 CSS 动画的帧率（FPS，Frames Per Second）值是衡量动画性能和流畅度的一个重要指标。常见的方法包括使用开发者工具的性能监控功能、JavaScript APIs，以及第三方库。以下是一些详细的方法：
1px问题是前端开发中的一个常见问题，通常出现在移动设备上，尤其是高分辨率屏幕（如 Retina 显示屏）上。这种问题的表现是，当你期望绘制一条 1px 宽的边框或线条时，它在某些设备上可能看起来比 1px 更粗。这是由于这些设备的像素密度较高，1px 的实际显示宽度可能大于 1px 导致的。
在网页中绘制 0.5px 的线可以通过几种不同的方法来实现，尽管通常来说，浏览器并不直接支持 0.5px 的线条宽度。以下是一些常用的方法：
网页元素的层叠顺序（stacking order）是指元素在页面上呈现的前后关系，即哪些元素显示在其他元素的上方或下方。理解层叠顺序对于控制元素的显示顺序和解决 z-index 问题非常重要。以下是影响元素层叠顺序的主要规则和概念：
`z-index` 属性主要用于控制元素的堆叠顺序，只有在特定的条件下才会生效。以下是一些常见情况下 `z-index` 可能会失效或不起作用的原因：
CSS 工程化是指在前端开发中，通过系统化的方法和工具链来优化 CSS 的编写、管理和维护。随着 Web 项目规模的扩大和复杂性增加，传统的 CSS 开发方式容易导致样式冲突、代码冗余和难以维护等问题。CSS 工程化的目标是通过模块化、规范化、自动化等手段，提升代码质量和开发效率。
在 CSS 中，伪元素和伪类使用不同的语法表示，它们分别使用双冒号 `::` 和单冒号 `:`。具体来说：
在 HTML 中，`<li>` 元素与 `<li>` 元素之间通常会有一个看不见的空白间隔。这种现象通常是由于浏览器在处理内联元素和内联块元素时，会将换行、空格、制表符等空白字符渲染为一个空格所导致的。
在 HTML 中，可以通过 `<link>` 元素和 `@import` 规则来引用 CSS 文件。虽然这两种方法都能引入外部 CSS，但它们在工作原理、使用场景和性能等方面有一些关键区别。