css
已收录文章:47篇
-
CSS 容器查询让卡片组件根据自身可用宽度改变布局,而不是只看浏览器宽度。本文用商品卡片示例讲清 container-type、@container、断点选择和回归检查。491 收藏
-
CSS 的 height:auto 过去很难直接做平滑过渡。本文从 max-height 和 JavaScript 测量的旧方案切入,演示 interpolate-size: allow-keywords 的最小改造,并核对继承范围、浏览器降级与 prefers-reduced-motion 边界。475 收藏
-
CSS color-mix() 可以从基础主题色派生 hover、浅底和边框状态,但混合空间与透明度会改变最终观感。本文用 token、对比度和 fallback 验收一套可落地的主题色方案。465 收藏
-
本文从 position sticky 写了却不吸顶的现场出发,按滚动容器、top 值、父级 overflow、高度限制和表格/弹窗布局逐步排查,并给出修复与复查清单。449 收藏
-
原生 dialog 和 popover 关闭时直接消失,通常不是 opacity 写错,而是 display 的离散切换没有参与过渡。本文用一组不依赖框架的 CSS/HTML 示例,解释 @starting-style、display、overlay 与 transition-behavior 的配合方式,并给出旧浏览器的降级边界。444 收藏
-
普通 CSS 自定义属性更像字符串,直接参与渐变时常常只能跳变。本文用 @property 注册颜色属性,说明 syntax、inherits、initial-value 的配合方式,并通过渐变、无障碍和旧浏览器降级检查完成验收。443 收藏
-
用 CSS field-sizing: content 让文本输入框按内容收缩和增长,同时用 min-width、max-width 与 fallback 控制窄屏布局和旧浏览器兼容。442 收藏
-
文章 · 前端 | 2个月前 | 前端 · 性能优化 · css · 前端 渲染性能 CSS性能 CLS content-visibility contain-intrinsic-size Layout从长页面首屏慢、滚动卡和 Layout 时间高的现象入手,讲清 content-visibility:auto 如何跳过离屏区块,为什么要配 contain-intrinsic-size,并给出 DevTools 复查和上线检查清单。430 收藏
-
white-space-collapse 把空白折叠从 white-space 中拆出来,适合处理用户输入、代码片段和多行说明。本文用最小示例解释 collapse、preserve、preserve-breaks、preserve-spaces、break-spaces 的差异,并给出旧浏览器降级与验收方法。430 收藏
-
问题内容我知道视频会随自身的比例缩放,我的问题是,视频本身帧宽高为1920*804,放置在video标签内,当浏览器窗口宽度(也是video标签宽度)为1920时,video标签的高度不是804,而是536,这是为什427 收藏
-
跨文档 View Transitions 不是给单页应用换皮:当前页和目标页要同源并同时用 @view-transition 选择加入,元素命名还要避免冲突。本文从多页站点导航现场出发,给出最小接入、滚动位置处理、浏览器降级和上线验收清单。412 收藏
-
今天的知识点 (2020.03.17) —— 第336天 (我也要出题) [html] 当html中使用map标签时,area中coords值如何精确定位呢? [css] 鼠标事件css的:hover和js的mouseover有什么区别? [js] 如何判断一个元素文本是否411 收藏