CSS
关注
分享
扫一扫
文章平均质量分 63
等下吃什么？
余幼时即厌学
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
tailwindcss group-hover 不生效
tailwindcss group-hover 不生效原创 2024-09-28 11:25:14 · 847 阅读 · 0 评论 -
CSS实现返回顶部功能
CSS实现返回顶部功能原创 2022-09-22 16:14:45 · 2543 阅读 · 1 评论 -
用户头像加载失败时，显示用户名首字符
用户头像加载失败时，显示用户名字首字符原创 2022-09-22 11:27:34 · 275 阅读 · 0 评论 -
input placeholder 文字提示样式
input placeholder 文字提示样式。原创 2022-08-07 22:00:38 · 366 阅读 · 0 评论 -
CSS 实现数据埋点上报
灵感来源：https://www.zhangxinxu.com/wordpress/2018/12/css-data-report-html-validate/测试场景统计某些元素的使用率统计某种字体的支持率统计CSS3的支持率统计某些css属性的支持率<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title.原创 2021-12-16 15:01:21 · 259 阅读 · 0 评论 -
＜meter＞标签实现 密码强度效果
灵感方法来源：https://www.zhangxinxu.com/wordpress/2021/11/html-meter-password/meter标签 + zxcvbn算法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <inpu.原创 2021-12-10 17:33:42 · 789 阅读 · 1 评论 -
CSS 滚动优化 scroll-behavior / scroll-snap-
滚动过渡当用户手动导航或者 CSSOM scrolling API 触发滚动操作时，控制滚动容器的滚动行为给可滚动容器添加scroll-behavior: smooth，实现平滑滚动{ scroll-behavior: smooth;}控制滚动结束位置scroll-snap-typescroll-snap-type: none | [ x | y | block | inline | both ] [ mandatory | proximity ]设置在父级滚动容器中x：捕转载 2021-05-08 22:17:48 · 651 阅读 · 0 评论 -
transform: translate在IOS下失效
样式如下 .ant-progress { margin-top: 30px; position: relative; left: 50%; transform: translateX(-50%); }在安卓中，效果如下在IOS中，效果如下解决办法：网上找不到比较好的方法，所有选择曲线救国，在外面套个Div，用伸缩布局实现居中 <div style={{ display: 'flex', width: '100%', justi原创 2021-04-02 12:10:38 · 1803 阅读 · 0 评论 -
CSS 角标选中、右下角选中效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>角标选中</title> <style> .box { width: 100px; height: 100px; position: relative; }.转载 2021-01-18 22:56:58 · 2408 阅读 · 1 评论 -
CSS3 实现30种阴影特效
效果总览盒子阴影基本样式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>阴影特效</title> <style> .box { position: relative; width: 300px; height: 30原创 2021-01-18 22:45:30 · 1648 阅读 · 0 评论 -
CSS优化
使用简写、提炼共同样式简写语句，可以从根本上减小 CSS 文件的大小。更多缩写<style> /* 样式简写 */ p { margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px; } p { margin: 1px 2px 3px 4px } /* 颜色缩写 */ a { color: #ffffff } a { color: #fff }.转载 2021-01-02 21:53:20 · 202 阅读 · 0 评论 -
如何设置12px以下的文字，以及文字缩放后位置偏移的问题
用scale来控制文字缩放时，会出现位置偏移的问题，如下图<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> p{ font-size: 12px; } .small{ t原创 2021-01-02 20:02:26 · 1517 阅读 · 1 评论