以上是目标样式，第一个字母大概24px，后面的大概19px，并且都是大写。
如果单纯的给A和T两个字母添加标签再设置字体大小的话，那么设置的underlin；会有所差别，效果如下：
很明显下划线不在一条水平线上。为了解决这个问题可以有两种方法；
第一种：为<p>标签设置border-bottom，可以说设置颜色等属性。
第二种:HTML标签
<p class="about">about</p>
<p class="about">technologe</p>
css样式:
.about{font-size:24px;
color:#000;
font-family:"微软雅黑";
text-decoration:underline;
text-transform:capitalize;/*关键样式*/
font-variant:small-caps;/*关键样式*/
text-transform属性：
这个属性会改变元素中的字母大小写，不管原文档中的字母大小写。如值为capitalize，则要对某些字母大写，但并没有明确定义什么字母大写。
font-variant属性：
设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换成大写，但是所有使用小型的大写字体的字母与其余文本相比，其字体更小。（意味着已经使用大写字母的文本字体会更大）。
原文：