Sunday 15 September 2013

Kode HTML untuk Pecahan Matematika

Pecahan dapat dibuat dengan table HTML. Saya menggunakan style border-top CSS untuk membuat garis fraksi berikut contohnya :

x =   x2 + x + 1
2 cos(x)

Di sini persamaannya jika garis tabel diaktifkan, sehingga Anda dapat melihat di mana sel'nya atau garisnya :

x =   x2 + x + 1
2 cos(x)

Berikut ini adalah Source Kode HTML dan CSS yang menghasilkan bentuk pecahan.


<style>
    td.upper_line { border-top:solid 1px black; }
    table.fraction { text-align: center; vertical-align: middle;
        margin-top:0.5em; margin-bottom:0.5em; line-height: 2em; }
</style>

<table class="fraction" align="center" cellpadding="0" cellspacing="0">
    <tr>
        <td rowspan="2" nowrap="nowrap">
            <i>x</i> =  
        </td><td nowrap="nowrap">
            <i>x</i><sup>2</sup> + <i>x</i> + 1
        </td>
    </tr><tr>
        <td class="upper_line">
            2 cos(<i>x</i>)
        </td>
    </tr>
</table>
 
Perhatikan bahwa bagian dari persamaan yang tidak dalam pecahan dimasukkan ke dalam sel tabel terpisah yang mencakup baris tabel tersebut. Saya menemukan bahwa indentasi yang tepat membantu untuk membuat HTML lebih mudah dibaca saat authoring. Saya tidak menggunakan macro untuk tabel ini karena macro akan mengaburkan Indentasi pecahan.

No comments:

Post a Comment