Menampilkan Simbol Akar Kuadrat Pada Web HTML(Blog)

Akar kuadrat juga bisa dilakukan dengan perintah <table> HTML. Berikut ini contohnya :

r = √

x2 + y2

Berikut persamaa jika sel tabel ditampilkan :

r = √

x2 + y2

Berikut Source Code HTML-nya :

<table style="margin-top:0.5em; margin-bottom:0.5em; text-align: center;"
    align="center" cellpadding="0" cellspacing="0" >
    <tr>
        <td nowrap="nowrap" align="right">
            <i>r</i> = <span style="font-size: 150%;">&radic;</span>
        </td><td style="border-top:solid 1px black;" nowrap="nowrap">
            &nbsp;<i>x</i><sup>2</sup> + <i>y</i><sup>2</sup>
        </td>
    </tr>
</table>

 

Hal yang perlu diperhatikan :

• simbol radikal diberikan ukuran font yang lebih besar; 
• garis horizontal dibuat dengan memberikan sel perbatasan atas;
• Saya menggunakan non-breaking space untuk memberikan sedikit lebih banyak ruang sebelah radikal.

Untuk konsistensi dan fleksibilitas Anda mungkin ingin menggunakan gaya CSS kelas bukan direktif gaya dalam perintah <table> (ini ditampilkan dalam fraksi contoh di atas).

Radikal yang lebih besar dapat memiliki dengan meningkatkan ukuran font (meskipun masing-masing browser menafsirkan ini sedikit berbeda), di sini adalah contoh yang dikombinasikan dengan pecahan :  

r = √	x2 + y2
	5

Sebuah pendekatan yang berbeda adalah dengan menggunakan gambar bitmap untuk simbol radikal. Dengan CSS posisi absolut Anda dapat membuat PNG transparan atau GIF bitmap dan posisi itu atas teks. Tapi kelemahan pendekatan ini adalah: jika pengguna memilih ukuran font yang berbeda, maka simbol radikal tidak akan skala dengan benar bersama dengan teks di bawah radikal, dan kualitas cetak tidak sebagus saat pencampuran bitmap dan teks.