我关注了 StackOverflow 中的许多帖子,但他们谈论的是堆叠分数。
我正在研究像这样显示对角分数:

这是我的代码:
* {
font-size: 50px;
}
.container {
display: inline-grid;
grid-template-columns: auto auto;
grid-template-rows: auto auto;
border: 1px solid red;
}
.numerator {
grid-column: 1/2;
grid-row: 1/2;
border: 1px solid green;
}
.denominator {
grid-column: 2/3;
grid-row: 2/3;
border: 1px solid green;
}Run Code Online (Sandbox Code Playgroud)
<span class="container"><span class="numerator">3</span><span class="denominator">5</span></span><br><br>
<span class="container"><span class="numerator">17</span><span class="denominator">4113</span></span>Run Code Online (Sandbox Code Playgroud)
注意:为了清楚起见,我添加了边框。
但是,我不知道如何在两者之间添加斜杠。请帮忙。
小智 5
一种简单的方法是仅使用下标标签和上标标签。
<p>This text contains <sup>23</sup>/<sub>24</sub> of a number</p>
Run Code Online (Sandbox Code Playgroud)
此文本包含23 / 24个数字