因为它们源自 iPad 第一代的物理分辨率(768×1024),不是视口宽度,更不是用户真实浏览场景。现代移动端浏览器默认缩放、桌面端高 DPR 屏幕、折叠屏、竖屏笔记本都会让这些数值失效。
css
精选推荐
Grid网格布局如何实现瀑布流效果_利用grid-auto-flow:dense自动填补空白
HTML如何实现顺序选择器_表单步骤设计指南【解析】
最新动态
CSS断点选择艺术_常用屏幕尺寸的标准断点设置指南
CSS项目实战之数据仪表盘片段_简单的矩形统计图设计
矩形统计图(比如横向柱状图)本质是「等高、宽度按数据比例缩放的色块排列」,flex 是最轻量且响应友好的选择。用 float 会破坏文档流,导致父容器高度塌陷;用 absolute 则失去弹性,数据一变就得重算 left/top。
CSS颜色函数lighten与darken实现_在CSS中模拟色彩深浅
CSS 原生不提供 lighten() 或 darken() 这类函数。你看到的要么是 Sass/Less 的预处理器功能,要么是 JS 动态计算的结果。直接写 color: lighten(#3498db, 20%); 会完全失效,浏览器连解析都不会解析——它就不是 CSS 语法。
CSS伪类:is()在现代CSS架构中的性能与语法优势
因为浏览器对 :is() 内部的选择器只做一次解析和匹配,而不是把每个逗号分隔项展开成独立规则去重复计算。这直接降低了样式表的解析开销和重排重绘时的匹配成本。
CSS加载状态提示器_各种圆形、条形Loader的CSS实现
因为浏览器对transform和opacity的动画能走合成层(compositor thread),不触发重排重绘;而用left、top、width等属性驱动动画,每次变化都会强制同步计算样式+布局+绘制,尤其在低端设备或复杂页面里容易掉帧甚至肉眼可见闪烁。
CSS项目实战之文章排版系统_字体、行间距与段落优化
Windows 和 macOS 渲染中文字体的默认行为差异大,单写 "Microsoft YaHei" 在 Mac 上会回退到不一致的系统字体,甚至触发 Times New Roman 这种灾难性 fallback。
css:empty伪类如何清空内容_通过伪类选择空元素进行样式控制
:empty 只匹配**完全不含子节点(包括文本节点、元素节点、注释节点)的元素**。哪怕有一个空格、换行符或 HTML 注释,它就不是空的。
CSS伪类:placeholder-shown应用_占位符显示时的交互逻辑
直接用 :placeholder-shown 伪类就行,但它只对 <input> 和 <textarea></textarea> 生效,且必须是原生 placeholder 属性触发的占位符(不是 JS 模拟的)。
如何使用CSS Grid布局构建项目_项目中使用Grid实现网格布局
CSS Grid 是目前最直接、可控性最强的二维布局方案,适合构建固定结构或响应式网格系统;用 display: grid 就能启动,但关键在如何合理设置 grid-template-columns 和 grid-gap。
CSS颜色属性全解析_整理100个关于颜色的属性与值
CSS 里根本不存在「100个颜色属性」——这是对 CSS 颜色体系的严重误解。真正可用的颜色相关属性只有 color、background-color、border-color、outline-color、fill、stroke 等寥寥几个,其余全是「值」,不是「属性」。