知识文章 · 编写日期 2026-11-10

色漫描边字：加粗边线为何吃掉内色

因为默认顺序先画填充，再画描边；沿轮廓居中的描边会盖住一部分内侧填色。在支持paint-order的SVG中，把顺序改为stroke fill可先画边线、再用填充覆盖内半边。它改变覆盖顺序，不是把描边路径移到外侧。

色漫的漫画画面与标题制作知识，使用原创几何模型和非露骨拟声字。按W3C SVG 2绘制顺序章节讨论独立SVG元素，不把该属性冒称为所有绘画软件的同名功能。

先画哪一层，决定哪一层盖在上面

SVG 2规定normal按填充、描边、标记的顺序绘制。paint-order: stroke fill则把描边放到填充之前；省略的标记仍在后面。这个顺序作用于单个图形或文字的绘制操作，不是整个文档中所有对象的前后次序。

漫画标题采用浅色字面和深色粗边时，默认顺序可能让细笔画中的浅色越来越窄。若目标是保留原来的字面形状，可尝试先描后填；如果目标本来是深色边线覆盖字面，则默认顺序也可能符合设计。不能只看参数名字判断好坏。

原创模型的矩形路径宽160单位，填浅色，描深色，stroke-width设为32单位。不加变换、透明度或滤镜，只看远离拐角的水平截面。普通居中描边向内、向外各伸16单位。

先填后描时，左右各有16单位内色被盖住，可见浅色宽160-16-16=128单位；先描后填时，后画的实色覆盖内半边描边，浅色恢复到160单位。两版外沿跨度都为160+16+16=192单位。

因此先描后填没有把32单位边线全部推到外面。在这个模型中，外侧仍只伸16单位。如果需要更宽的可见外缘，要重新设定线宽并检查邻字间距；不能把paint-order当作描边对齐方式。

图中“咚”使用同一字形、同一字号、同一线宽，左侧先填后描，右侧先描后填。比较的是内色保留情况；没有测量读者辨认速度，也不把某一种外观称为统一漫画规范。矩形算例用于解释机制，不等于每个汉字笔画都有128或160单位宽。

填充覆盖内侧边线后，字外侧和字腔中的边线仍可能压缩空隙。特别是小字、复杂汉字和紧排标题，先描后填并不能自动打开所有字腔。应在最终尺寸下检查；需要时减细描边、加大字距或另选字形，而非无限加粗。

先复制一个标题元素，只保留不透明填充、普通描边和相同字形。A用paint-order: normal，B用paint-order: stroke fill；保持字号、位置和stroke-width相同。若同时改字号或换字体，就不能把差异都归给绘制顺序。

SVG中fill=none的空心图形没有内色可覆盖描边；半透明填充也不会像本例实色那样完全遮住后方。若文件被转成图片，新的结果取决于实际渲染器；如果进入另一编辑器，应检查导入导出后有没有保留预期顺序。

保留可编辑源文件和一份最终尺寸预览。图形与文字的细节检查属于当前作品任务，不由一个CSS属性自动完成；本页也不更改本站已有漫画学习文章的画面。

在这里的填充、描边、标记三种操作中，省略项按默认相对顺序追加，所以stroke等价于stroke fill markers。写全stroke fill更便于练习记录。

不会单凭这个属性改变不同元素的整体前后顺序。它处理该元素内部填充、描边与标记的绘制次序。

不能。线宽、字腔、字距、背景和输出尺寸仍会影响效果，尤其要检查复杂字形的空隙。

W3C SVG 2：Controlling paint operation order（W3C，核验日期 2026-11-10）
支持normal与指定顺序、遗漏项追加、适用图形与文字。160/32矩形和咚字对照为本站原创教具。