HTML/CSS布局数到表达式的力量(a ^ x)

Question

我需要在网页中布局一些数学表达式,不能使用latex或mathML,只是纯HTML(不是HTML5)

我有一个表达不同表达式的力量,例如(a + b + sqrt(c))^(2x + b)

第二个表达式应该在第一个表达式的右侧稍微小一些.

听起来很简单,但我似乎无法做到正确.

任何帮助都是造型和布局会很棒,谢谢.

Answer 1

在涉及数学表达式时,HTML相当有限.原则上,HTML规范建议您使用sup元素作为上标,因此示例表达式将是

(<i>a</i> + <i>b</i> + ?<i>c</i>)<sup>2<i>x</i> + <i>b</i></sup>

但是,sup浏览器中的实现是不一致的并且通常较差(导致例如不均匀的行间距),因此使用span带有类的元素实际上更好:

(<i>a</i> + <i>b</i> + ?<i>c</i>)<span class=sup>2<i>x</i> + <i>b</i></span>

用CSS代码

.sup {
  position: relative;
  bottom: 1ex; 
  font-size: 80%;
}

我的页面数学在HTML(和CSS)中解释了一些原因.还要考虑包含复杂数学表达式的页面的基于JavaScript的库:

样本表达式是边界情况; 它看起来数学上更正确的,如果平方根使用具有平方根符号表示的Vinculum并不仅仅是√ Ç,并尝试使用HTML构建一个钮带和CSS变得比较脏,但除此之外,它可以使用HTML和CSS进行合理处理.

我故意使用`i`元素,我只是回滚编辑错误地将它改为`em`.首先,改变别人的答案,即使你对"语义"是正确的,你的"语义标记"的想法也是错误的.其次,HTML规范不同意"em"的意思,但它们都指的是某种强调.数学中变量的斜体用法是常规符号,而不是任何强调.如果你真的想使用"语义"标记,那么`var`会更接近. (2认同)