CSS @规则(At-rules)系列详解
___@counter-style 规则使用方法
零、时光宝盒
（https://blog.csdn.net/weixin_69553582 逆境清醒）
鸟妈妈在雨天用自己的翅膀给小鸟撑起了一个温暖的家。希望你们和你们家人一起，共同在风雨中撑起一个温暖休憩的家，为了你们家人，也为了你们自己。
图片来源于网络视频截图。
逆境清醒
2024.10.17
一、@counter-style 规则定义和用法
在 CSS 中，@counter-style 规则用于自定义列表计数器的样式。
通过 @counter-style 规则，你可以定义列表项的计数器的样式，包括计数器的类型、前缀、后缀、递增方式等。这允许你创建自定义的计数器样式，使列表更具个性化和可读性。
@counter-style 规则使用以下语法：
@counter-style name {properties;
}其中，name 是你为计数器样式起的名称，properties 是一个包含计数器样式属性的声明块。
常用的 @counter-style 属性包括：
- - system：指定计数器的类型，可以是 numeric、alphabetic、symbolic 或 fixed；
- - symbols：指定计数器的符号；
- - suffix：指定计数器的后缀；
- - additive-symbols：用于指定多位数的计数器符号。
二、@counter-style 语法
2.1、正式语法
@counter-style = @counter-style <counter-style-name> { <declaration-list> } 语法：
@counter-style @规则：
由 计数器样式名称 标识，并且可以使用由一个或多个 描述符 及其值组成的 <declaration-list> 对命名计数器的样式进行微调。
计数器样式名称<counter-style-name>：
为您的计数器样式提供一个名称。
它被指定为一个区分大小写的 <custom-ident>，不带引号。
该值不应等于 none。
与所有自定义标识符一样，计数器样式的值不能是 CSS 全局关键字。避免其他枚举的 CSS 属性值，包括 列表 和 计数器样式 属性的值。
计数器的名称不能是 decimal、disc、square、circle、disclosure-open 和 disclosure-closed 等不区分大小写的 list-style-type 属性值。
注意：
不可覆盖的计数器样式名称 decimal、disc、square、circle、disclosure-open 和 disclosure-closed 不能用作自定义计数器的名称。
但是，它们在预期 <counter-style-name> 数据类型的其他上下文中有效，例如在 system: extends <counter-style-name> 中。
2.2、更改与计数器关联的词缀
更改与计数器关联的词缀 （前缀和/或后缀）
在列表中，计数器可能跟着一个句点 + 空格，用括号括起来，或者后面跟一个特定于脚本的分隔符，等等。事实上，同一页面上可能会使用不同的策略，具体取决于嵌套级别或使用列表的上下文。
对于此处显示的样式，我们应用通用的默认值。（通常，未指定 non，这将导致句点 + 空格后缀。如果你想要一个不同的词缀，你应该做适当的改变。
需要按如下方式显式定义仅空格后缀：
suffix: ' ';
括号中的计数器需要同时定义 prefix 和 suffix：
prefix: '(';
suffix: ') ';
注释用于描述给定样式的替代词缀，当它们涉及非 ASCII 字符或其他特殊排列时，将提供建议的代码。
例如，Myanmar 可能用作后缀，因此 Myanmar 部分包括：
suffix: '။ ';
如果你想为给定的 counter 样式提供多个替代的词缀声明，你会发现使用标准扩展机制添加另一种样式是最有效的。
例如，下面定义了两种样式，它们仅在使用的前缀/后缀上有所不同。
样式一：
@counter-style myanmar {
system: numeric;
symbols: '\FF10' '\FF11' '\FF12' '\FF13' '\FF14' '\FF15' '\FF16' '\FF17' '\FF18' '\FF19';
/* symbols: '０' '１' '２' '３' '４' '５' '６' '７' '８' '９'; */
prefix: '(';
suffix: ') ';
}
ol { list-style-type: myanmar; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>
<br>
<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ul><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ul></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>效果如下：
样式二：
@counter-style myanmar {
system: numeric;
symbols: '\FF10' '\FF11' '\FF12' '\FF13' '\FF14' '\FF15' '\FF16' '\FF17' '\FF18' '\FF19';
/* symbols: '０' '１' '２' '３' '４' '５' '６' '７' '８' '９'; */
prefix: '';
suffix: "။ ";
}
ol { list-style-type: myanmar; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>
<br>
<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ul><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ul></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>效果如下：
2.3、描述符
| 描述符 | ||
| system | 指定用于将计数器的整数值转换为字符串表示形式的算法。 | 如果该值为 cyclic、numeric、alphabetic、symbolic 或 fixed， 则还必须指定 symbols 描述符。 如果该值为 additive， 则还必须指定 additive-symbols 描述符。 |
| symbols | 指定要用于标记表示的符号。 如果 system 描述符设置为 cyclic、numeric、alphabetic、symbolic 或 fixed，则此描述符是必需的。 | 符号可以包含字符串、图像或自定义标识符。 |
| additive-symbols | 定义加法计数器的加法元组。 描述符是一个计数器符号列表及其非负整数权重，按权重降序排列。 如果system描述符设置为additive，则需要此描述符。 | 大多数算法使用symbols描述符中指定的符号来构建标记表示。 加法计数器系统（例如罗马数字）由一系列加权符号组成。 |
| negative | 指定如果值为负数，则要附加到或前置到计数器表示的符号。 | |
| prefix | 指定应前置到标记表示的符号。前缀在最后阶段添加到表示中，在negative描述符为负计数器值添加的任何字符之前。 | |
| suffix | 类似于前缀描述符，指定附加到标记表示的符号。 后缀位于标记表示之后，包括negative描述符为负计数器值添加的任何字符之后。 | |
| range | 定义计数器样式适用的值范围。 如果使用计数器样式来表示此描述符定义范围之外的计数器值，则计数器样式将回退到其fallback样式。 | |
| pad | 当您需要标记表示具有最小长度时使用。 例如，如果您希望计数器从01开始并依次递增到02、03、04等，则应使用pad描述符。 对于大于指定pad值的表示，标记将按正常方式构建。 | |
| speak-as | 描述语音合成器（例如屏幕阅读器）如何宣布计数器样式。 例如，列表项标记的值可以根据此描述符的值读出为数字或字母（对于有序列表）或音频提示（对于无序列表）。 | |
| fallback | 指定当指定的系统无法构造计数器值的表示形式，或者计数器值超出指定范围时要回退到的系统。 如果指定的后备也无法表示该值，则使用后备样式的后备（如果指定了）。 如果没有描述回退系统，或者如果回退系统链无法表示计数器值，那么它将最终回退到十进制样式。 | |
三、@counter-style 使用方法例子
3.1、指定符号使用Ⓐ Ⓑ Ⓒ Ⓓ。。。 Ⓩ
使用计数器样式指定符号
@counter-style circled-alpha {system: fixed;symbols: Ⓐ Ⓑ Ⓒ Ⓓ Ⓔ Ⓕ Ⓖ Ⓗ Ⓘ Ⓙ Ⓚ Ⓛ Ⓜ Ⓝ Ⓞ Ⓟ Ⓠ Ⓡ Ⓢ Ⓣ Ⓤ Ⓥ Ⓦ Ⓧ Ⓨ Ⓩ;suffix: " ";
}
li {list-style: circled-alpha;
}
上述计数器样式规则可以应用于如下列表
<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的计数前缀：
3.2、指定符号使用（指定符号symbols 码)
@counter-style thumbs {system: cyclic;symbols: "\270D";suffix: " ";
}ul {list-style: thumbs;
}<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的计数前缀：
3.3、指定符号使用（指定具体的symbols 图像)
@counter-style thumbs {system: cyclic;symbols: "🌻";suffix: " ";
}ul {list-style: thumbs;
}<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的计数前缀：
3.4、自定义有序列表前缀
@counter-style emoji-decimal {system: numeric;symbols: '\30\FE0F\20E3' '\31\FE0F\20E3' '\32\FE0F\20E3' '\33\FE0F\20E3' '\34\FE0F\20E3' '\35\FE0F\20E3' '\36\FE0F\20E3' '\37\FE0F\20E3' '\38\FE0F\20E3' '\39\FE0F\20E3';suffix: " ";
}ol { list-style-type: emoji-decimal; }<ol><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ol>这样，我们就可以得到自定义的有序列表前缀：
3.5、带圆圈的十进制
@counter-style filled-circled-decimal{
system: fixed;
symbols: '\2776' '\2777' '\2778' '\2779' '\277a' '\277b' '\277c' '\277d' '\277e' '\277f' '\24EB' '\24EC' '\24ED' '\24EE' '\24EF' '\24F0' '\24F1' '\24F2' '\24F3' '\24F4';
/* symbols: '❶' '❷' '❸' '❹' '❺' '❻' '❼' '❽' '❾' '❿' '⓫' '⓬' '⓭' '⓮' '⓯' '⓰' '⓱' '⓲' '⓳' '⓴'; */
suffix: ' ';
}
ul { list-style-type: filled-circled-decimal; }<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的带圆圈的十进制有序列表前缀：
3.6、全角十进制
@counter-style fullwidth-decimal {
system: numeric;
symbols: '\FF10' '\FF11' '\FF12' '\FF13' '\FF14' '\FF15' '\FF16' '\FF17' '\FF18' '\FF19';
/* symbols: '０' '１' '２' '３' '４' '５' '６' '７' '８' '９'; */
suffix: '\FF0E';
/* suffix: '．'; */
}
ul { list-style-type: fullwidth-decimal; }<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的全角十进制有序列表前缀：
3.7、括号大小为十进制
@counter-style parenthesized-decimal {
system: fixed;
symbols: '\2474' '\2475' '\2476' '\2477' '\2478' '\2479' '\247A' '\247B' '\247C' '\247D' '\247E' '\247F' '\2480' '\2481' '\2482' '\2483' '\2484' '\2485' '\2486' '\2487';
/* symbols: '⑴' '⑵' '⑶' '⑷' '⑸' '⑹' '⑺' '⑻' '⑼' '⑽' '⑾' '⑿' '⒀' '⒁' '⒂' '⒃' '⒄' '⒅' '⒆' '⒇'; */
suffix: ' ';
}
ul { list-style-type: parenthesized-decimal; }<ul><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li><li>心朝太阳，用吸收的满满正能量去蒸发掉忧伤。</li>
</ul>这样，我们就可以得到自定义的括号大小为十进制有序列表前缀：
3.8、梵文
@counter-style bodo {
system: alphabetic;
symbols: '\915' '\916' '\917' '\918' '\919' '\91A' '\91B' '\91C' '\91D' '\91E' '\91F' '\920' '\921' '\922' '\923' '\924' '\925' '\926' '\927' '\928' '\92A' '\92B' '\92C' '\92D' '\92E' '\92F' '\930' '\932' '\935' '\936' '\937' '\938' '\939' ;
/* symbols: 'क' 'ख' 'ग' 'घ' 'ङ' 'च' 'छ' 'ज' 'झ' 'ञ' 'ट' 'ठ' 'ड' 'ढ' 'ण' 'त' 'थ' 'द' 'ध' 'न' 'प' 'फ' 'ब' 'भ' 'म' 'य' 'र' 'ल' 'व' 'श' 'ष' 'स' 'ह' */
suffix: ') ';
}
ol { list-style-type: bodo; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>这样，我们就可以得到自定义的梵文有序列表前缀：
3.9、日语
@counter-style hiragana {
system: alphabetic;
symbols: '\3042' '\3044' '\3046' '\3048' '\304A' '\304B' '\304D' '\304F' '\3051' '\3053' '\3055' '\3057' '\3059' '\305B' '\305D' '\305F' '\3061' '\3064' '\3066' '\3068' '\306A' '\306B' '\306C' '\306D' '\306E' '\306F' '\3072' '\3075' '\3078' '\307B' '\307E' '\307F' '\3080' '\3081' '\3082' '\3084' '\3086' '\3088' '\3089' '\308A' '\308B' '\308C' '\308D' '\308F' '\3090' '\3091' '\3092' '\3093';
/* symbols: あ い う え お か き く け こ さ し す せ そ た ち つ て と な に ぬ ね の は ひ ふ へ ほ ま み む め も や ゆ よ ら り る れ ろ わ ゐ ゑ を ん; */
suffix: '、';
}
ol { list-style-type: hiragana; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>这样，我们就可以得到自定义的日语有序列表前缀：
3.10、带圆圈的朝鲜语辅音
@counter-style circled-korean-consonant {
system: fixed;
symbols: '\3260' '\3261' '\3262' '\3263' '\3264' '\3265' '\3266' '\3267' '\3268' '\3269' '\326A' '\326B' '\326C' '\326D';
/* symbols: '㉠' '㉡' '㉢' '㉣' '㉤' '㉥' '㉦' '㉧' '㉨' '㉩' '㉪' '㉫' '㉬' '㉭'; */
suffix: ' ';
}
ol { list-style-type:circled-korean-consonant; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>这样，我们就可以得到自定义的带圆圈的朝鲜语辅音有序列表前缀：
3.11、韩语
@counter-style korean-hangul-formal {
system: additive;
range: -9999 9999;
additive-symbols: 9000 '\AD6C\CC9C', 8000 '\D314\CC9C', 7000 '\CE60\CC9C', 6000 '\C721\CC9C', 5000 '\C624\CC9C', 4000 '\C0AC\CC9C', 3000 '\C0BC\CC9C', 2000 '\C774\CC9C', 1000 '\C77C\CC9C', 900 '\AD6C\BC31', 800 '\D314\BC31', 700 '\CE60\BC31', 600 '\C721\BC31', 500 '\C624\BC31', 400 '\C0AC\BC31', 300 '\C0BC\BC31', 200 '\C774\BC31', 100 '\C77C\BC31', 90 '\AD6C\C2ED', 80 '\D314\C2ED', 70 '\CE60\C2ED', 60 '\C721\C2ED', 50 '\C624\C2ED', 40 '\C0AC\C2ED', 30 '\C0BC\C2ED', 20 '\C774\C2ED', 10 '\C77C\C2ED', 9 '\AD6C', 8 '\D314', 7 '\CE60', 6 '\C721', 5 '\C624', 4 '\C0AC', 3 '\C0BC', 2 '\C774', 1 '\C77C', 0 '\C601';
/* additive-symbols: 9000 구천, 8000 팔천, 7000 칠천, 6000 육천, 5000 오천, 4000 사천, 3000 삼천, 2000 이천, 1000 일천, 900 구백, 800 팔백, 700 칠백, 600 육백, 500 오백, 400 사백, 300 삼백, 200 이백, 100 일백, 90 구십, 80 팔십, 70 칠십, 60 육십, 50 오십, 40 사십, 30 삼십, 20 이십, 10 일십, 9 구, 8 팔, 7 칠, 6 육, 5 오, 4 사, 3 삼, 2 이, 1 일, 0 영 */
suffix:', ';
negative: "\B9C8\C774\B108\C2A4 ";
/* 마이너스 (followed by a space) */
}
ol { list-style-type:korean-hangul-formal; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>这样，我们就可以得到自定义的韩语有序列表前缀：
3.9、泰语
@counter-style thai {
system: numeric;
symbols: '\E50' '\E51' '\E52' '\E53' '\E54' '\E55' '\E56' '\E57' '\E58' '\E59';
/* symbols: '๐' '๑' '๒' '๓' '๔' '๕' '๖' '๗' '๘' '๙'; */
}ol { list-style-type: thai; }<ol><li>第一项</li><li>第二项<!-- closing </li> tag not here! --><ol><li>第二项第一子项</li><li>第二项第二子项</li><li>第二项第三子项</li></ol></li><!-- Here's the closing </li> tag --><li>第三项</li>
</ol>这样，我们就可以得到自定义的泰语有序列表前缀：
推荐阅读：CSS @规则(At-rules)索引目录
|
|
|
|
| 给照片换底色（python+opencv） | 猫十二分类 | 基于大模型的虚拟数字人__虚拟主播实例 |
|
|
|
|
| 计算机视觉__基本图像操作（显示、读取、保存） | 直方图（颜色直方图、灰度直方图） | 直方图均衡化（调节图像亮度、对比度） |
|
|
|
|
| 语音识别实战（python代码）(一） | 人工智能基础篇 | 计算机视觉基础__图像特征 |
|
| ||
| matplotlib 自带绘图样式效果展示速查（28种，全） | ||
|
| ||
| Three.js实例详解___旋转的精灵女孩(附完整代码和资源)（一） | ||
|
|
|
|
| 立体多层玫瑰绘图源码__玫瑰花python 绘图源码集锦 | Python 3D可视化（一） | 让你的作品更出色——词云Word Cloud的制作方法（基于python，WordCloud，stylecloud) |
|
|
|
|
| python Format()函数的用法___实例详解（一）(全，例多）___各种格式化替换，format对齐打印 | 用代码写出浪漫__合集（python、matplotlib、Matlab、java绘制爱心、玫瑰花、前端特效玫瑰、爱心） | python爱心源代码集锦（18款） |
|
|
|
|
| Python中Print()函数的用法___实例详解(全，例多） | Python函数方法实例详解全集(更新中...) | 《 Python List 列表全实例详解系列（一）》__系列总目录、列表概念 |
|
|
| |
| 用代码过中秋，python海龟月饼你要不要尝一口？ | python练习题目录 | |
|
|
|
|
| 草莓熊python turtle绘图（风车版）附源代码 | 草莓熊python turtle绘图代码（玫瑰花版）附源代码 | 草莓熊python绘图（春节版，圣诞倒数雪花版）附源代码 |
|
|
| |
| 巴斯光年python turtle绘图__附源代码 | 皮卡丘python turtle海龟绘图（电力球版）附源代码 | |
|
|
|
|
| Node.js (v19.1.0npm 8.19.3) vue.js安装配置教程（超详细） | 色彩颜色对照表（一）(16进制、RGB、CMYK、HSV、中英文名) | 2024年6月多家权威机构____编程语言排行榜__薪酬状况 |
|
|
|
|
| 手机屏幕坏了____怎么把里面的资料导出（18种方法） | 【CSDN云IDE】个人使用体验和建议（含超详细操作教程）（python、webGL方向) | 查看jdk安装路径，在windows上实现多个java jdk的共存解决办法，安装java19后终端乱码的解决 |
|
| ||
| vue3 项目搭建教程（基于create-vue，vite，Vite + Vue） | ||
|
|
|
|
| 2023年春节祝福第二弹——送你一只守护兔，让它温暖每一个你【html5 css3】画会动的小兔子，炫酷充电，字体特 | 别具一格，原创唯美浪漫情人节表白专辑，(复制就可用)（html5,css3,svg)表白爱心代码(4套) | SVG实例详解系列（一）(svg概述、位图和矢量图区别（图解）、SVG应用实例） |
|
|
|
|
| 【程序人生】卡塔尔世界杯元素python海龟绘图（附源代码），世界杯主题前端特效5个（附源码） | HTML+CSS+svg绘制精美彩色闪灯圣诞树，HTML+CSS+Js实时新年时间倒数倒计时(附源代码) | 2023春节祝福系列第一弹（上）（放飞祈福孔明灯，祝福大家身体健康）（附完整源代码及资源免费下载） |
|
|
|
|
| tomcat11、tomcat10 安装配置（Windows环境）（详细图文） | Tomcat端口配置（详细） | Tomcat 启动闪退问题解决集（八大类详细） |
