突然想到这个东西,然后写下来留个纪念,方法也很简单。
文章目录
CSS代码HTML代码全部代码效果如下:
CSS代码
主要利用的是文本阴影效果:text-shadow。
text-shadow兼容性:Internet Explorer 10、Firefox、Chrome、Safari 以及 Opera 支持
<style>.content {font-size:50px; /*字体大为了明显显示效果*/text-shadow: 0 0 1px #63a35c; /*描边颜色自己定义*/color:#fff; /*字体颜色白色,看着有镂空效果*/}</style>
HTML代码
<div class="content">中文描边效果</div>
全部代码
<!doctype html><html lang="zh"><head><meta charset="UTF-8"><title>文字描边效果</title><style>.content {font-size:50px; /*字体大为了明显显示效果*/text-shadow: 0 0 1px #63a35c; /*描边颜色自己定义*/color:#fff; /*字体颜色白色,看着有镂空效果*/}</style></head><body><div class="content">中文描边效果</div></body></html>