1. 首頁
  2. 問答
  3. MathJax公式的HTML邊框

MathJax公式的HTML邊框

2017-02-12 87 views
1

我想圍繞MathJax的輸出繪製紅色邊框。所以我用這個代碼：MathJax公式的HTML邊框

<html> 
    <head> 
    <script type="text/x-mathjax-config"> 
    MathJax.Hub.Config({ 
    extensions: ["tex2jax.js","TeX/noUndefined.js"], 
    jax: ["input/TeX","output/HTML-CSS"], 
    tex2jax: {inlineMath: [["$","$"],["\\(","\\)"]]}, 
    TeX: {extensions: ["AMSmath.js","AMSsymbols.js"]} 
    }); 
    </script> 
    <script type="text/javascript" src="/path/to/MathJax.js"> 
    </script> 
    </head> 
    <body> 
    <style> 
    p1 { 
     border: 5px solid #FF0000; 
    } 
    </style> 
    <p1> 
     <p>$$x = {-b \pm \sqrt{b^2-4ac} \over 2a}$$ 
     </p> 
    </p1> 
    </body> 
</html>

但結果有兩個垂直的紅色線條在頁面的左側，而不是紅色邊框：

enter image description here

我怎麼能解決這個問題？

注意：
我不想使用MathJax樣式。

來源

2017-02-12 hasanghaforian

+1

HTMLUnkownElement默認'display'可能是'inline'，加上'顯示：[inline-]塊; '在你的風格，或修復你的標記，這樣你就不會創建這樣的unknownelents ... – Kaiido

回答

2

嘗試使用類P1

風格

.p1 { 
    border: 5px solid #FF0000; 
    width: 90%; 
    min-width: 300px; 
}

HTML

<p class='p1'> 
     $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}$$ 
</p>

來源

2017-02-12 08:15:37 scaisEdge

+0

謝謝你的回覆。現在邊框寬度與瀏覽器的寬度大致相等。有沒有一種方法可以繪製寬度接近MathJax輸出寬度的邊框？ – hasanghaforian

+0

你可以定義邊界的暗淡設置容器的暗淡。如果你需要寬度，你可以減少課堂..分配一個固定的或％的價值..我有udapte的答案..看看css的p （或更好的div）元素 – scaisEdge

+0

不好意思，我問了一個不正確的問題。 '是否有辦法實現寬度比寬度更大的邊框？'。例如，如果我替換更長的公式，它會超出邊框邊緣。 – hasanghaforian

相關問題

 相關問題