HTML Online Editor
Run ❯
<!DOCTYPE html> <html> <head> <style> body { font-family:Arial; } .box{ border:3px solid green;padding:5px;text-align:center; font-size:1rem; /* box ini menggunakan 1rem=16px, karena standar web, root fontnya 16px */ margin-bottom:.5rem; /* jarak ke bawah 8px, karena 8/16 = 0.5 */ } .box2{ border:3px solid blue;margin-bottom:.5rem;padding:5px;text-align:center; font-size:1.25rem; /* 20:16 = 1.25, artinya besar huruf 20px*/ } </style> </head> <body> <div class="box"> <p>Box ini dengan font-size 1rem = 16px.</p> </div> <div class="box2"> <p>Box ini dengan font-size 1.25rem = 20px.</p> </div> <div style="font-size:20px">Teks ini menggunakan ukuran fix 20px. bandingkan dengan 1.25rem sama bukan?</div> </body> </html>