如何在不使用MathML的情況下在html中呈現嵌套的平方根？

Question

我正在嘗試使用html和css呈現以下類型的表達式。

SQRT(2 + SQRT(2 + SQRT(2)))

我無法使用MathML，因為即使在最新版本的IE和Chrome中也不支持它。 我感謝任何幫助或建議。

這是我最好的，使用“基本”實體√和文本裝飾：上線，但我無法想出一種方法來為同一行html渲染多個上線。 我沒有嘗試定位/分層。

<span style="font-size:48px;">&radic;<span style="text-decoration:overline">2 + </span></span>
<span style="font-size:36px;">&radic;<span style="text-decoration:overline">2 + </span>   </span>
<span style="font-size:24px;">&radic;<span style="text-decoration:overline">2</span></span>

嵌套SPAN並不是更好（事實上，它更糟）因為那時我最終只是在整個表達式之上繪制的最外面的上划線。

Answer 1

你試圖讓它工作的方式可能會讓它工作但我希望每次你有一個新表達時都會有一個非常繁瑣的過程：我的建議是看看

• mathJax
• tex2png

你真的不想看着試圖純粹用html / css做。 每次有新表達時都會花費你的年齡。

但如果你做得最好，我得到的是：

<span style="font-size:48px;">&radic;<span style="text-decoration:overline">2 + 
<span style="font-size:36px;">&radic;<span style="text-decoration:overline">2 +  
<span style="font-size:24px;">&radic;<span style="text-decoration:overline">2</span></span>  </span></span></span></span>

在玩了一點高度后，它看起來會沒問題。

Answer 2

您可以嘗試使用mathjax： http ： //www.mathjax.org/

它具有出色的瀏覽器兼容性

Answer 3

以下內容完全符合數學符號國際標准ISO 80000-2：

√（2 +√（2 +√2））

即使在純文本中也可以使用此表示法。 如果你想要不同的渲染，使用virgules作為根，最好使用像MathJax這樣的工具。