/** * 碑文效果 - 文字刻入屏幕的视觉效果 * 使用方式：在或任意容器上添加 class="epitaph-text" */ /* 基础碑文效果 - 适用于亮色背景 */ .epitaph-text { /* 文字颜色比背景稍深，模拟刻痕 */ color: #3a3a3a; /* * 多重阴影创建凹陷效果： * 1. 左上角高光（模拟光线从左上照射，刻痕底部反光） * 2. 右下角阴影（模拟刻痕深度） */ text-shadow: /* 左上高光 - 浅色 */ -1px -1px 1px rgba(255, 255, 255, 0.7), /* 右下阴影 - 深色，创造深度感 */ 1px 1px 2px rgba(0, 0, 0, 0.4), /* 额外阴影增加层次感 */ 0px 1px 1px rgba(0, 0, 0, 0.2); /* 字间距稍宽，更像碑文 */ letter-spacing: 0.02em; /* 字体权重稍轻，细线条更像刻痕 */ font-weight: 400; } /* 暗色背景版本 - 适用于深色主题 */ .epitaph-text-dark { /* 文字颜色比背景稍浅 */ color: #c5c5c5; text-shadow: /* 左上阴影 - 模拟刻痕边缘 */ -1px -1px 1px rgba(0, 0, 0, 0.8), /* 右下高光 - 模拟光线照射 */ 1px 1px 2px rgba(255, 255, 255, 0.3), /* 内发光效果 */ 0 0 3px rgba(255, 255, 255, 0.1); letter-spacing: 0.02em; font-weight: 400; } /* 强烈碑文效果 - 更深的刻痕 */ .epitaph-text-strong { color: #2d2d2d; text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.9), 1px 1px 3px rgba(0, 0, 0, 0.5), 2px 2px 4px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.3); letter-spacing: 0.03em; } /* 轻微碑文效果 - 更 subtle */ .epitaph-text-subtle { color: inherit; text-shadow: -0.5px -0.5px 0.5px rgba(255, 255, 255, 0.6), 0.5px 0.5px 1px rgba(0, 0, 0, 0.3); letter-spacing: 0.01em; } /* 金属质感碑文 - 金色/古铜色 */ .epitaph-text-metal { color: #8b7355; text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.8), 1px 1px 2px rgba(60, 40, 20, 0.5), 0 0 4px rgba(139, 115, 85, 0.3); letter-spacing: 0.025em; } /* 石刻质感 - 配合背景图使用 */ .epitaph-text-stone { color: #5a5a5a; text-shadow: /* 顶部高光 */ 0 -1px 1px rgba(255, 255, 255, 0.5), /* 底部阴影 */ 0 1px 2px rgba(0, 0, 0, 0.4), /* 内部阴影 */ inset 0 1px 2px rgba(0, 0, 0, 0.2); letter-spacing: 0.02em; } /* 全站自动应用 - 如果要在全站使用，取消下面注释 */ /* body { color: #3a3a3a; text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.7), 1px 1px 2px rgba(0, 0, 0, 0.3); } body h1, body h2, body h3, body h4, body h5, body h6 { text-shadow: -1px -1px 1px rgba(255, 255, 255, 0.8), 1px 1px 3px rgba(0, 0, 0, 0.4), 2px 2px 4px rgba(0, 0, 0, 0.2); } */ /* 鼠标悬停时减弱效果，增加交互感 */ .epitaph-text-hover:hover { text-shadow: -0.5px -0.5px 0.5px rgba(255, 255, 255, 0.5), 0.5px 0.5px 1px rgba(0, 0, 0, 0.2); transition: text-shadow 0.3s ease; } /* 选中文字时恢复正常，便于阅读 */ .epitaph-text::selection, .epitaph-text-dark::selection, .epitaph-text-strong::selection, .epitaph-text-subtle::selection { text-shadow: none; background-color: rgba(139, 154, 140, 0.3); }