Dalam sebuah halaman HTML adakalanya dibutuhkan bentuk penulisan khusus. Seperti pada penulisan dengan spasi yang agak menjorok antar kata. Atau apabila halaman membahas tentang koding maka perlu ditampilkan tulisan dengan jenis monospace.
Untuk melakukan hal tersebut bisa menggunakan tag <pre> dan ditutup dengan </pre>. HTML akan menampilkan konten teks yang berada di dalam tag <pre> sebagimana bentuk yang diketik. Misalkan ketika memberi jarak 10 spasi, apabila tanpa tag <pre> saaat dijalankan tetap akan tampil dengan satu spasi.
Dengan mengunakan tag <pre>, anda bisa menampilkan bentuk penulisan yang diinginkan. Contohnya bisa anda coba jalankan script di bawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Membuat Quotes dalam HTML</title>
</head>
<body>
<h2> Ini adalah contoh penulisan pakai pre</h2>
<p> maka kedudukan
presiden di
indonesia adalah sebagai pemerintah </p>
<br/>
<pre> maka kedudukan
presiden di
indonesia adalah sebagai pemerintah </pre>
</body>
</html>
Perhatikan bagian kode yang berwarna merah dan biru. Kedua kode diketik dalam bentuk yang sama tetapi dengan tag berbeda. Coba lihat tampilan. Kode merah tetap ditampilkan seperti halaman normal. Agar teks bisa terlihat sebagaimana yang diketik, maka gunakan penulisan dengan tag <pre> sebagaimana yang ditunjukkan oleh warna biru. Sekarang anda tahu maksud penggunaan <pre> ini bukan?
Sementara itu untuk penggunaan tag <code> perannya sama dengan <pre>. Hanya jika menggunakan tag <code> maka penulisan tersebut menyatu dengan paragraf. Bentuk 'aneh' yang ditulis hanya berlaku pada kata/kalimat yang berada diantara tag <code> dan </code > tersebut saja.
Sebagai contoh, anda bisa menjalankan kode dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Membuat Quotes dalam HTML</title>
</head>
<body>
<h2> Ini adalah contoh penulisan pakai q</h2>
<p> UUD 1945 adalah Konstitusi Resmi di Indonesia . Oleh karena itu wajib diamalkan</p>
<p> UUD 1945 adalah <code> Konstitusi resmi di Indonesia </code>. Oleh sebab itu wajib diamalkan </p>
</body>
</html>
Dari kode berwarna merah tanpa menggunakan tag <code> tampilan akan seperti biasanya. Sementara pada kode berwarna biru dibubuhkan tag <code> sehingga pada tampilan akan berubah pada kalimat yang berada di tag tersebut (" Konsitusi Resmi di Indonesia").
Untuk melakukan hal tersebut bisa menggunakan tag <pre> dan ditutup dengan </pre>. HTML akan menampilkan konten teks yang berada di dalam tag <pre> sebagimana bentuk yang diketik. Misalkan ketika memberi jarak 10 spasi, apabila tanpa tag <pre> saaat dijalankan tetap akan tampil dengan satu spasi.
Dengan mengunakan tag <pre>, anda bisa menampilkan bentuk penulisan yang diinginkan. Contohnya bisa anda coba jalankan script di bawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Membuat Quotes dalam HTML</title>
</head>
<body>
<h2> Ini adalah contoh penulisan pakai pre</h2>
<p> maka kedudukan
presiden di
indonesia adalah sebagai pemerintah </p>
<br/>
<pre> maka kedudukan
presiden di
indonesia adalah sebagai pemerintah </pre>
</body>
</html>
Perhatikan bagian kode yang berwarna merah dan biru. Kedua kode diketik dalam bentuk yang sama tetapi dengan tag berbeda. Coba lihat tampilan. Kode merah tetap ditampilkan seperti halaman normal. Agar teks bisa terlihat sebagaimana yang diketik, maka gunakan penulisan dengan tag <pre> sebagaimana yang ditunjukkan oleh warna biru. Sekarang anda tahu maksud penggunaan <pre> ini bukan?
Sementara itu untuk penggunaan tag <code> perannya sama dengan <pre>. Hanya jika menggunakan tag <code> maka penulisan tersebut menyatu dengan paragraf. Bentuk 'aneh' yang ditulis hanya berlaku pada kata/kalimat yang berada diantara tag <code> dan </code > tersebut saja.
Sebagai contoh, anda bisa menjalankan kode dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>Membuat Quotes dalam HTML</title>
</head>
<body>
<h2> Ini adalah contoh penulisan pakai q</h2>
<p> UUD 1945 adalah Konstitusi Resmi di Indonesia . Oleh karena itu wajib diamalkan</p>
<p> UUD 1945 adalah <code> Konstitusi resmi di Indonesia </code>. Oleh sebab itu wajib diamalkan </p>
</body>
</html>
Dari kode berwarna merah tanpa menggunakan tag <code> tampilan akan seperti biasanya. Sementara pada kode berwarna biru dibubuhkan tag <code> sehingga pada tampilan akan berubah pada kalimat yang berada di tag tersebut (" Konsitusi Resmi di Indonesia").
Share Yuk
Related Posts
Loading...
No comments:
Post a Comment