我想设计一个简单的数学应用来训练分数。 我想知道如何在所有最新的浏览器(Chrome,Safari,Firefox,IE)中显示所有分数。
维基百科将它们嵌入为png,例如:
但对于一个动态的网络应用来说,这似乎是非常有用的,我想要生成学生应该使用的随机分数。
也许Mathjax
有帮助?
例如,我想显示8/5 x 7/4 = ?
。
答案 0 :(得分:4)
css有一种非常简单的方法。如果你只想显示分数,这个效果很好。对于更复杂的算术公式,这个解决方案可能很复杂。
预览强>
Fraction Example Preview http://imageshack.com/a/img824/218/c6y7.png
<强> HTML 强>
<div class="fraction">
<span class="top">8</span>
<span class="bottom">5</span>
</div>
<div class="fraction">
<span class="operator">*</span>
</div>
<div class="fraction">
<span class="top">7</span>
<span class="bottom">4</span>
</div>
<div class="fraction">
<span class="operator">= ?</span>
</div>
<强> CSS 强>
.fraction, .top, .bottom {
padding: 0 5px;
}
.fraction {
display: inline-block;
text-align: center;
}
.bottom{
border-top: 1px solid #000;
display: block;
}
.operator {
overflow: auto;
display: block;
margin-bottom: 5px;
}