How to write summation expression in HTML?

问题

How to write equivalent HTML expression for following Latex:

$$\sum_{k=1}^Nk(N-k+1)

The image is:

enter image description here

I did like this:

∑ <sub>k=1</sub> <sup>N</sup>

but output is like this

∑ _k=1^N

I am not good at HTML and I searched on web but couldn't find answer. Please help on this..Thanks!

回答1:

If you need it for a lot of stuff in your project you'll probably find MathJax useful. Otherwise if you need just this one formula then try this - DEMO

<p>
    <span>&Sigma;</span>
    k ( N - k + 1 )
</p>

CSS

p {
    height: 50px;
    line-height: 50px;
}

span {
    position: relative;
    font-size: 2.5em;
    display: inline-block;
    line-height: .7em;
    vertical-align: middle;
}

span:before {
    font-size: 12px;
    display: block;
    position absolute;
    left: 0;
    top: 0;
    content: "N";
    width: 22px;
    text-align: center;
}

span:after {
    font-size: 12px;
    display: block;
    position absolute;
    left: 0;
    bottom: 0;
    content: "k = 1";
    width: 27px;
    text-align: center;
}

回答2:

Use Mathjax: http://www.mathjax.org/

It is built specifically for what you are looking for.

回答3:

Whilst MathJax is almost certainly the correct answer (there is even an example of a summation on the homepage), you can use simple HTML elements (however these won't look as good as the final MathJax/LaTeX results).

The summation sign is HTML entity ∑ and the super- and sub-scripts can be marked up with the sup and sub elements, so try:

&sum;<sub>k=1</sub><sup>N</sup> k (N - k + 1)

to get: ∑_k=1^N k (N - k + 1) .

回答4:

As others have written, the best option is probably MathJax, though perhaps the lightweight jqMath might suit some needs better. Here’s how to use MathJax for your formula (for production use, consider uploading the MathJax software onto your own server):

<!DOCTYPE html>
<title>MathJax demo</title>
<script src=
"http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>
$$\sum_{k=1}^Nk(N-k+1)$$

Pure HTML won’t take you very far, and even with CSS styling, the results are unsatisfactory for display formulas. You would need to use CSS positioning (which would get tricky here) or a clumsy table-based construct in HTML; cf. to my notes Math in HTML (and CSS), especially the notes on two-dimensionality at the end.

来源：https://stackoverflow.com/questions/13626132/how-to-write-summation-expression-in-html

标签

html

web