模板:色卡标签/styles.css - 版本历史

2026年10月6日 (二) 09:53 Ancimen

2026-10-06T09:53:42Z

←上一版本		2026年10月6日 (二) 17:53的版本
第46行：		第46行：
	/* ---- 悬停高亮：亮度呼吸 ---- */		/* ---- 悬停高亮：亮度呼吸 ---- */
	@keyframes tag-highlight-breath {		@keyframes tag-highlight-breath {
	0%, 38% { filter: brightness(1); }		0%, 100% { filter: brightness(1); }
	50% { filter: brightness(1.35~~); }~~		50% { filter: brightness(1.35); }
	~~62%, 100% { filter: brightness(1~~); }
	}		}
	.tag:hover {		.tag:hover {
	animation: tag-highlight-breath var(--tag-highlight-speed, 2s) ease-in-out infinite;		animation: tag-highlight-breath var(--tag-highlight-speed, 2s) ease-in-out infinite;
	}		}

2026年10月6日 (二) 09:51 Ancimen

2026-10-06T09:51:34Z

←上一版本		2026年10月6日 (二) 17:51的版本
第44行：		第44行：
	.tag__corner--br { bottom: 0.3em; right: 0.4em; }		.tag__corner--br { bottom: 0.3em; right: 0.4em; }

	/* ---- ~~悬停高亮：呼吸显隐~~ ---- */		/* ---- 悬停高亮：亮度呼吸 ---- */
	@keyframes tag-highlight-breath {		@keyframes tag-highlight-breath {
	0%, 38% { ~~opacity~~: ~~0.25~~; }		0%, 38% { filter: brightness(1); }
	50% { ~~opacity~~: 0; }		50% { filter: brightness(1.35); }
	62%, 100% { ~~opacity~~: ~~0.25~~; }		62%, 100% { filter: brightness(1); }
	}		}
	~~.tag::after {~~		.tag:hover {
	~~content: "";~~
	~~position: absolute;~~
	~~inset: 0;~~
	~~background: var(--tag-highlight, #ffffff);~~
	~~opacity: 0;~~
	~~pointer-events: none;~~
	~~z-index: 0;~~
	}
	.tag:hover~~::after~~ {
	animation: tag-highlight-breath var(--tag-highlight-speed, 2s) ease-in-out infinite;		animation: tag-highlight-breath var(--tag-highlight-speed, 2s) ease-in-out infinite;
	}		}

2026年10月6日 (二) 09:49 Ancimen

2026-10-06T09:49:49Z

←上一版本		2026年10月6日 (二) 17:49的版本
第43行：		第43行：
	.tag__corner--bl { bottom: 0.3em; left: 0.4em; }		.tag__corner--bl { bottom: 0.3em; left: 0.4em; }
	.tag__corner--br { bottom: 0.3em; right: 0.4em; }		.tag__corner--br { bottom: 0.3em; right: 0.4em; }

			/* ---- 悬停高亮：呼吸显隐 ---- */
			@keyframes tag-highlight-breath {
			0%, 38% { opacity: 0.25; }
			50% { opacity: 0; }
			62%, 100% { opacity: 0.25; }
			}
			.tag::after {
			content: "";
			position: absolute;
			inset: 0;
			background: var(--tag-highlight, #ffffff);
			opacity: 0;
			pointer-events: none;
			z-index: 0;
			}
			.tag:hover::after {
			animation: tag-highlight-breath var(--tag-highlight-speed, 2s) ease-in-out infinite;
			}

2026年10月6日 (二) 09:46 Ancimen

2026-10-06T09:46:34Z

@@ 第2行： / 第2行： @@
     色卡标签
     ============================================ */
 .tag {
      position: relative;
      overflow: hidden;
+}
 .tag__link {
      position: absolute;
@@ 第18行： / 第29行： @@
      height: 100%;
+}

Ancimen：创建页面，内容为“/* ============================================ 色卡标签 ============================================ */ .tag { position: relative; overflow: hidden; } .taglink { position: absolute; inset: 0; z-index: 10; display: block; font-size: 0; } .taglink a { display: block; width: 100%; height: 100%; }”

2026-10-06T09:39:06Z

创建页面，内容为“============================================ 色卡标签 ============================================： .tag { position: relative; overflow: hidden; } .tag__link { position: absolute; inset: 0; z-index: 10; display: block; font-size: 0; } .tag__link a { display: block; width: 100%; height: 100%; }”

新页面

/* ============================================
色卡标签
============================================ */
.tag {
position: relative;
overflow: hidden;
}
.tag__link {
position: absolute;
inset: 0;
z-index: 10;
display: block;
font-size: 0;
}
.tag__link a {
display: block;
width: 100%;
height: 100%;
}