- 简介
- 目录大纲
- 最新文档
4个好用的 CSS 伪类 not()、has()、 is()、where()
4个好用的 CSS 伪类 :not()、:has()、 :is()、:where() :not() 定义::not 伪类:用于选择不满足给定条件的元素,也被称为反选伪类。 语法: :not(selector) 示例:除了class为.two, .five,其他的li元素背景颜色变为红色 ``` ul :not(.two, .five) { background-c……
admin - 2024年7月9日 15:17
css特效:图片倒影
图片倒影是一种常见的CSS特效,它通过CSS样式创建一个图像的镜像反射效果,使图像看起来像是倒影在水面上的效果。 ~~~html 图片倒影 body { padding-top: 100px; width: 100%; height: 100vh; overflow: hidden; } .img-wrapper { ……
admin - 2024年7月2日 11:40
CSS 中的 Clamp 函数:掌握动态布局的秘籍
在前端开发领域,实现响应式设计的关键之一是能够灵活地控制元素尺寸,确保它们既不过小影响阅读,也不至于过大破坏布局和谐。CSS 的 clamp() 函数正是这样一位能手,它允许你为长度、宽度、字体大小等属性设定一个动态范围,确保其值始终位于这个范围之内,无论屏幕尺寸如何变化。本文将深入探讨 clamp() 函数的使用方法、应用场景及代码示例,助你掌握这一动态布局的秘密武器。 什么是 Clamp 函数……
admin - 2024年7月2日 11:40
纯 CSS 实现十个还不错的 Loading 效果
作者:Jimmy,版权归原作者所有,如有侵权请及时联系 https://juejin.cn/post/7080542771387301896 在推特上面看到 *T. Afif*[1] 介绍的十个 Loading 效果。如上图。 Yeah,很赞哦,挺实用的,遂记录下来。 为保证运行正常,咱先规定下: css * { box-sizing: border-box; } 1. 平滑加载 ```……
admin - 2024年7月2日 11:40