text-shadow凸起效果配参为：-1px -1px 0 #fff, 1px 1px 0 #666；核心是左上浅色高光+右下深色投影，文字色用#aaa、背景用#eee或#333，禁用模糊值以保边缘锐利。
直接用 text-shadow 叠加方向相反、颜色对比的两层阴影，就能做出可用的浮雕效果——不需要 JS，不依赖新特性，IE9 起全支持。
text-shadow 凸起效果怎么配参数
凸起（raised）效果的核心是：文字颜色居中，上方/左方加浅色阴影模拟高光，下方/右方加深色阴影模拟投影。
-
text-shadow: -1px -1px 0 #fff, 1px 1px 0 #666;是最简可行组合：第一层向左上偏移的白色高光，第二层向右下偏移的深灰投影 - 文字颜色建议用中性灰（如
#aaa），背景用略浅或略深的灰（如#eee或#333），避免纯黑/纯白导致对比过猛失真 - 别用模糊值（第三参数设为
0），否则边缘发虚，立体感变“软” - 如果想增强厚度，可把偏移值加大到
2px 2px，但注意超过3px后容易和背景割裂，像贴纸而非浮雕
text-shadow 凹陷效果的常见错误
凹陷（pressed/inset）不是简单把凸起的参数取负，而是光源逻辑要反过来：高光在阴影方向，暗部在高光方向。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 错误写法：
text-shadow: 1px 1px 0 #fff, -1px -1px 0 #666;—— 这实际仍呈现凸起，只是方向反了 - 正确逻辑：高光在右下（
1px 1px 0 #ddd），暗部在左上（-1px -1px 0 #333），文字本身用比背景稍深的颜色（如背景#f0f0f0，文字#ccc） - 移动端 Safari 对多层
text-shadow渲染较慢，凹陷效果建议严格控制在 2 层，避免卡顿 - 深色背景上做凹陷极难看清，此时应改用凸起+亮文字，或放弃浮雕，换用
border+background模拟压印质感
为什么加了 text-shadow 还看不出立体感
问题通常不出在语法，而在三者关系没调准：文字色、阴影色、背景色之间的明度梯度断裂。
- 检查是否用了纯黑文字（
#000）配深灰阴影（#333）—— 在浅背景上几乎无差别；换成#555文字 +#bbb高光 +#222投影试试 - 确认没有意外覆盖：某些重置 CSS（如
* { text-shadow: none; }）会清掉你写的样式 - Firefox 会忽略
text-shadow中带透明度的 rgba 值当第三参数非 0 时的渲染，比如1px 1px 2px rgba(0,0,0,.3)在旧版 FF 可能不显示，优先用十六进制色值 - 字体本身太细（
font-weight: 200）或太小（）时，阴影偏移会糊成一团，建议最小字号设为 <code>32px，并用font-weight: 700以上
真正难调的不是参数本身，而是背景亮度和文字灰度之间那 10% 的明度差——它决定了浮雕是“刚好浮现”，还是“突兀飘起”。同一组代码换到深色模式下大概率失效，必须单独适配。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
