laoyang
05b4b56bf6
4.0.0 引用块首尾加引号,让引用文字与正文段落对齐 #32
用户诉求(原话):引用块有色块和左侧宽度,导致块内文字比正文段落更靠右,
缩进不一致。方案:色块保留,在引用首尾各加一个引号,用引号占住那段缩进。
改前实测(1440 视口,线上真实文章):
正文段落 p 文字起点 99
blockquote 框内沿 89,块内 p 文字起点 121
⇒ 引用文字比正文靠右 22px,且块内段落还叠了一层 32px 首行缩进
修法:
· border-left 6 + padding-left 26 = 32 = 正文 text-indent:2em(16px×2)
· 块内 > p 的 text-indent 归零,消除「块内缩 + 段首缩进」双层叠加
· 左引号 position:absolute 悬浮在 padding 区(inline 会被 block 级 p
挤成匿名块行,跑到段落上方)
· 右引号挂 > p:last-of-type,display:inline-block + line-height:0
+ height:0 + overflow:visible —— 行盒贡献 0,不撑高(否则块高 89→121)
· 引号放大到 60/56px,淡色 #c6d2dd 做装饰;暗色降到 #3d4b58
两个踩到的坑(都只有像素级测量能发现):
① CJK 全角字形左侧 side bearing ≈ 0.62em。30px 字号下伪元素盒在
x=12(完全正确),但引号墨迹在 30.5~40,正压在首字 32.5 上 ——
「盒对了」≠「字形画在那儿」。指定 Georgia 等拉丁衬线字体后
side bearing 降到 ≈0.03em,再用 left:2px/top:15px/font-size:60px。
② 窄屏(≤768px)kratos.css 把 .content p 降到 15px ⇒ 2em=30,
硬编码的 32 就多 2px。不能写 calc(2em - 6px)(em 基数是 blockquote
自己的 15px,不随视口变),只能在同一个断点覆盖;且这个 @media
必须放在 ::before 基础规则之后,否则同特异性被后出现的 left:2px 压掉。
版本号 3.2.64 → 4.0.0(用户要求跳大版本:引用块渲染方式变了,
第三方 CSS 若针对 blockquote 内部做微调会受影响)。
验证:
_geom32.js 48/0(3 篇 × 5 视口,对齐差全部 0.00px)
_pix400.py 76/0(像素差分:墨迹落在缩进空白内、不压字、不撑高)
_mkzip400.py 61/0
_mkzip400_falsify 20/0(18 组注入全部报红在预期判据)
_pix400_falsify 8/0
_readme400.py 36/0(readme 15 节,181195 字节)
php -l 97 文件 / 0 失败
包 kratos_yang-4.0.0.zip md5 bc23f478d5f5170524aec3921b10e6ff
已发 /theme-update/,update.json 指向 4.0.0,PUC 实测 getUpdate=4.0.0。
主题目录未覆盖(仍是 3.2.64),等用户在后台点升级。
2026-10-28 12:15:38 +08:00
..
2022-01-07 11:15:42 +08:00
2026-10-26 18:42:40 +08:00
2022-01-07 11:15:42 +08:00
2026-10-26 18:42:40 +08:00
2026-10-26 12:20:33 +08:00
2026-10-26 11:00:47 +08:00
2022-01-07 11:15:42 +08:00
2026-10-27 13:33:53 +08:00
2026-10-27 13:33:53 +08:00
2022-01-07 11:15:42 +08:00
2026-10-25 23:03:13 +08:00
2026-10-28 12:15:38 +08:00
2026-10-25 13:37:26 +08:00
2022-01-07 11:15:42 +08:00