css
已收录文章：29篇
-
CSS 容器查询让卡片组件根据自身可用宽度改变布局，而不是只看浏览器宽度。本文用商品卡片示例讲清 container-type、@container、断点选择和回归检查。491 收藏
-
文章 · 前端 | 2天前 | 布局 · css · 前端动画 · 浏览器兼容 · 渐进增强 · CSS 前端动画 浏览器兼容 interpolate-size height auto calc-sizeCSS 的 height:auto 过去很难直接做平滑过渡。本文从 max-height 和 JavaScript 测量的旧方案切入，演示 interpolate-size: allow-keywords 的最小改造，并核对继承范围、浏览器降级与 prefers-reduced-motion 边界。475 收藏
-
本文从 position sticky 写了却不吸顶的现场出发，按滚动容器、top 值、父级 overflow、高度限制和表格/弹窗布局逐步排查，并给出修复与复查清单。449 收藏
-
原生 dialog 和 popover 关闭时直接消失，通常不是 opacity 写错，而是 display 的离散切换没有参与过渡。本文用一组不依赖框架的 CSS/HTML 示例，解释 @starting-style、display、overlay 与 transition-behavior 的配合方式，并给出旧浏览器的降级边界。444 收藏
-
文章 · 前端 | 1个月前 | 前端 · 性能优化 · css · Core Web Vitals · 渲染性能 · 前端 渲染性能 CSS性能 CLS content-visibility contain-intrinsic-size Layout从长页面首屏慢、滚动卡和 Layout 时间高的现象入手，讲清 content-visibility:auto 如何跳过离屏区块，为什么要配 contain-intrinsic-size，并给出 DevTools 复查和上线检查清单。430 收藏
-
问题内容我知道视频会随自身的比例缩放，我的问题是，视频本身帧宽高为1920*804，放置在video标签内，当浏览器窗口宽度(也是video标签宽度)为1920时，video标签的高度不是804，而是536，这是为什427 收藏
-
今天的知识点 (2020.03.17) —— 第336天 (我也要出题) [html] 当html中使用map标签时,area中coords值如何精确定位呢？ [css] 鼠标事件css的:hover和js的mouseover有什么区别？ [js] 如何判断一个元素文本是否411 收藏
-
印象中，无远开发平台只适合做强业务逻辑和重结构化的信息管理系统，实际上，只需稍作配置，也能实现偏重于前端展示的各种网站，比如下图展示的政务型网站：【示例一 政务型网站】示405 收藏
-
View Transition API 已经不只服务 SPA。本文用两个同源页面演示跨文档过渡，拆开 @view-transition、view-transition-name、pageswap/pagereveal 与不支持浏览器的降级边界。392 收藏
-
工作中遇到弹出模态框形式的修改功能，模态框里面是Form表单,Form表单中的内容是从后台获取的，这时候用户修改完没有提交，而是想重置然后重新修改，怎么办呢？①重新调一遍后台的接口，381 收藏
-
文章 · 前端 | 2星期前 | 前端 · javascript · css · 浏览器API · document.startViewTransition CSS View Transitions 页面切换动画用一个无框架商品列表示例，讲清 CSS View Transitions API 的最小接入、元素命名、同文档切换、降级处理和浏览器兼容边界。375 收藏
-
弹窗被导航、地图、页脚或抽屉遮住时，单纯调大 z-index 往往治标不治本。本文按完整工作流拆解层级现场、stacking context 定位、层级表设计、Portal 容器落地和回归验证。350 收藏