转换有序列表后,好像只能使用 1、2、3 编号,连二级列表也是。。。请问如何修改?
二级序号列表为啥还是 1、2、3 编号?如何修改编号样式?
相关帖子
-
我自己改了下这个序号 不知道是不是你想要的
.protyle-wysiwyg [data-node-id].li>[data-node-id] { margin-left: 30px !important; /* 一级列表偏移 */ padding-right: 0; } .b3-typography li>p, .b3-typography>p, .b3-typography blockquote>p, .b3-typography [data-node-id], .protyle-wysiwyg li>p, .protyle-wysiwyg>p, .protyle-wysiwyg blockquote>p, .protyle-wysiwyg [data-node-id] { line-height: 1.625; /* padding-left: 8px; */ padding: 4px; padding-left: 0px; margin: 2px 0; border-radius: var(--b3-border-radius); } /* 效果: 一级列表 1. 二级列表 1.1 三级列表 1.1.1 */ .list[data-subtype=o] { counter-reset: none; } .protyle-wysiwyg .li[data-subtype=o] { counter-increment: olcounter1 } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] { counter-increment: olcounter2; padding-left: 1.2%; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] > .protyle-action { color: rgba(0, 0, 0, 0) !important; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { content: counter(olcounter1, -moz-devanagari) "." counter(olcounter2, decimal); display: table; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] { counter-increment: olcounter3; padding-left: 3%; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action { color: rgba(0, 0, 0, 0) !important } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { content: counter(olcounter1, decimal) "." counter(olcounter2, decimal) "."counter(olcounter3, decimal) }
注: 只改了三级菜单(对我个人来说是够用了) 如果还想更多可以自行添加 应该可以按规律添加吧[手动狗头]
效果图
1 回复 - 其他回帖
-
-
.protyle-wysiwyg [data-node-id].li>[data-node-id] { padding-right: 0; } .b3-typography li>p, .b3-typography>p, .b3-typography blockquote>p, .b3-typography [data-node-id], .protyle-wysiwyg li>p, .protyle-wysiwyg>p, .protyle-wysiwyg blockquote>p, .protyle-wysiwyg [data-node-id] { line-height: 1.625; padding: 4px; padding-left: 0px; margin: 2px 0; border-radius: var(--b3-border-radius); } /* 效果: 一级列表 1. 二级列表 1.1 三级列表 1.1.1 */ .list[data-subtype=o] { counter-reset: none; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] > .protyle-action, .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action, .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action { color: rgba(0, 0, 0, 0) !important; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after, .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after, .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { display: table; } .protyle-wysiwyg .li[data-subtype=o] { counter-increment: olcounter1 } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] { counter-increment: olcounter2; padding-left: 2px; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] { counter-increment: olcounter3; padding-left: 8px; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] { counter-increment: olcounter4; padding-left: 5px; } @counter-style roman { system: cyclic; symbols: "①" "②" "③" "④" "⑤" "⑥" "⑦" "⑧" "⑨" "⑩" "⑪" "⑫"; suffix: ""; } .protyle-wysiwyg .li[data-subtype=o] > .protyle-action::after { content: counter(olcounter1, decimal); } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { content: counter(olcounter2, roman); } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { content: '(' counter(olcounter3, decimal) ")"; } .protyle-wysiwyg .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] .li[data-subtype=o] > .protyle-action::after { content: counter(olcounter4, decimal) ")"; }
效果图
感觉超过 11 及往后的就很小了
可以选择删除
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于