思考
如何通过一个标签实现如下效果：
一般我们实现的方式如下：
<span>￥</span><span>100</span>
定义两个标签分别设置不同的样式来搞定。
新思路
通过CSS属性::first-letter可以通过一个标签来实现类似效果。
<div class="price">￥100</div> .price::first-letter { font-size: 72%; }
效果如下：
first-letter的兼容性也是很好的。可以在实际项目中使用。另外，他有一个缺点就是他只能修改开头第一个字符，如果需要修改末尾单位的字符样式。也可以通过另外一个属性来设置。
size-adjust+ unicode-range
size-adjust 浏览器将调整字体大小，无论字体系列（"宋体"性质值0.58）
unicode-range 设置font-face特定的字符。
<div class="money">100元</div> @font-face { font-family: smallYuan; src: local('PingFang SC'), local('PingFang SC Light'), local('Source Han Sans CN'), local('Noto Sans CJK SC'), local("Microsoft Yahei"); size-adjust: 20%; unicode-range: U+5143; } .money { font-family: smallYuan; font-size: 24px; color: red; }
效果如下：
size-adjust+ unicode-range 的兼容性在当下并不是太小，不支持safari。所以采用的时候要注意这一点。
