CSS Grid 调试覆盖层 - 显示网格线与区域
在页面上叠加可拖拽的半透明网格线,辅助网格布局对齐。
UD5工具箱
—
—
| 字段 | 双精度 (Float64) | 单精度 (Float32) |
|---|---|---|
| 总位数 | — | — |
| 符号位 | — | — |
| 指数位数 | — | — |
| 尾数位数 | — | — |
| 指数偏移量 | 1023 | 127 |
| 存储指数 | — | — |
| 实际指数 | — | — |
| 尾数(二进制) | — | — |
| 十六进制 | — | — |
| 数值类型 | — | — |
| 特性 | 单精度 Float32 | 双精度 Float64 |
|---|---|---|
| 总位数 | 32 | 64 |
| 符号位 | 1 | 1 |
| 指数位 | 8 | 11 |
| 尾数位 | 23 | 52 |
| 指数偏移量 | 127 | 1023 |
| 约十进制精度 | ~7位有效数字 | ~15-17位有效数字 |
| 最大规约数 | ≈3.4×10³⁸ | ≈1.8×10³⁰⁸ |
| 最小正规约数 | ≈1.18×10⁻³⁸ | ≈2.23×10⁻³⁰⁸ |
0.10000000000000000555...,在单精度中约为0.10000000149011612...。这是浮点运算中累积误差的根本原因,也是金融计算通常使用定点数或十进制类型的原因。
Object.is(-0, +0)可以区分。负零的用途:在页面上叠加可拖拽的半透明网格线,辅助网格布局对齐。
并列播放所有CSS内置缓动函数(ease, linear等)的动画效果,方便对比选择。
为页面上使用CSS Grid的元素显示网格线和名称,辅助布局开发和调试。
拖拽调节Flex容器和子项属性,即时可视化响应效果,同时显示CSS代码,边学边用。
在任意网页上投射可拖拽调整的栅格覆盖线,用来测量和对齐设计稿。
在网格上设置起点/终点和障碍,动态演示广度优先、深度优先、A*等搜索过程。
输入文本,滑块调节letter-spacing和word-spacing,实时显示效果并复制CSS。
通过加权Voronoi点算法将图片转换为类似针笔画的黑白点描艺术效果。
将空格分隔的8位二进制序列解码为可读文本,支持ASCII及扩展字符集。
上传精灵图,自动切片检测或手动框选获取背景定位数值,生成CSS Sprite代码。
浏览并复制100种不同风格的纯CSS按钮代码,含悬停和点击动效。
基于斐波那契数列绘制黄金螺旋,展示各个正方形组成的矩形。
编写Brainfuck代码,以可视化的方式步进执行,观察活动纸带和指针。
可视化Flexbox容器和子项的所有属性及选项,鼠标悬停预览效果。
在绘图板画几条直线,算法自动利用霍夫变换检测并高亮出这些线段。
绑定动画进度到滚动位置,交互式调整参数,直观理解scroll-timeline和view-timeline。
输入嵌套对象和取值路径,测试?.可选链和??空值合并运算的结果,学习JS新特性。
在二进制和八进制数字之间实时转换,支持批量处理,方便嵌入式开发和数学运算。
拖拽两控制点精细微调CSS `cubic-bezier()` 曲线并对比预设函数效果。
展示Navigator.connection提供的网络类型、下行速度、RTT等实时信息,辅助自适应加载。
通过滑块和开关调整 Flex 容器和子项的所有 CSS 属性,实时观察布局变化,理解弹性盒子。
在网格上放置不同颜色珠子设计图案,模拟编织效果并计算所需珠子数量。
可视化配置原生 dialog 元素,添加表单并设置方法,生成完整 HTML/CSS/JS 代码。
随机可视化Skip List的层级结构和快速查找过程,对比链表效率。
输入 HTML 或网址,提取所有标题标签,生成文档大纲树,检测跳跃和缺失。
搜索CSS属性,显示其在主流浏览器的支持范围和前缀需求,快速避免踩坑。
配置多个背景层或前景层,设定各层滚动速度因子,生成完整视差页面代码。
可视化配置<dialog>元素外观与行为,生成现代化、无障碍友好的模态框代码。
设定物理页框数,输入页引用串,动画展示不同页面置换算法的缺页率。
提取HTML中内联style属性或嵌入式style标签,转变为独立CSS规则,辅助样式重构。