演示代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.a{
font-size: 40px;
background: red;
vertical-align: middle;
}
.b{
font-size: 20px;
background: green;
vertical-align: middle;/* 垂直对齐方式 */
}
</style>
</head>
<body>
<!-- <p>19.9<sub>元</sub></p>
<p>19.9<sup>元</sup></p> -->
<div>
<!--
垂直对齐方式:对行级元素,行内块级元素,表格元素有效
baseline 默认值,对其父元素基线.写字母4条线,从下往上数第二条线
sub,对其下标
super,对其上标
top,顶部对齐
bootom,底部对齐
middle,垂直居中
text-top
text-bottom
-->
<span class="a">19.9</span>
<span class="b">元</span>
</div>
</body>
</html>