最近看到了许多关于 :has() 选择器的知识点，在此总结下来。 MDN 对 :has() 选择器 的解释是这样的： 下面一起来感受下 :has() 选择器的强大之处吧。 :has() 选择器选择父元

你知道奇怪的移动视口错误（也称为100vh bug）吗？或者如何以正确的方式创建全屏块？ 一、100vh bug 什么是移动视口错误？ 你是否曾经在网页上创建过全屏元素？只需添加一行 CSS 并不难：

在一些 web 活动页中经常能看到特殊处理的标题文字，比如这样的 暂时忽略掉特殊字体，通过设计稿的图层样式可以发现，共有 3 个文字特效，分别是渐变、描边、投影 作为一个有追求的前端，当然不会直接用图

根据语言和字宽的不同，自动选择对应的字体。 一段文本如何使用多个字体？ 一段文本如何根据不同语言使用不同字体？ 不同字宽如何使用不同字体包？ 同一个字体多个字体包怎么办？

现如今的页面越来越复杂，一个页面往往承载着大量的元素，最常见的就是一些电商页面，数以万计的商品列表是怎么保证渲染不卡顿的，大家在面对这种长列表渲染的场景下，一般都会采用分页或者虚拟列表来减缓页面一次性

前端主题切换方案 现在我们经常可以看到一些网站会有类似暗黑模式/白天模式的主题切换功能，效果也是十分炫酷，在平时的开发场景中也有越来越多这样的需求，这里大致罗列一些常见的主题切换方案并分析其优劣，大家

大家总说性能优化的xxx条建议，但实际操作时又觉得很无力。本文就带你体验一次真实的性能优化案例和原理解析

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

2. 1px边框的问题 2. background-image 和border-image类似，准备一张符合条件的边框背景图，模拟在背景上。 上面两种都需要单独准备图片，而且圆角不是很好处理，但是可以应对大部分场景。 这种方式可以满足各种场景，如果需要满足圆角，只需要给伪类也加…