Formating Teks HTML

Mengatur tampilan teks atau kalimat dalam sebuah halaman web sangat penting untuk dilakukan, agar huruf / kata / kalimat yang disampaikan dapat dilihat, dibaca dan dimengerti dengan baik.

Beberapa perintah / tag HTML untuk pengaturan teks yang dapat dilakukan adalah:
Bentuk huruf (Font)
Ukuran huruf (Size)
Warna huruf
Jarak baris teks
Perataan teks
Dekorasi teks (Bold, Italic, Underline)
Teks berjalan
Perintah (tag) tersebut di atas pada umumnya terletak pada bagian elemen BODY.

Mengatur Bentuk dan Ukuran Huruf

Contoh perintah (tag) HTML yang digunakan untuk mengatur bentuk huruf atau font.

<html>
<head>
<TITLE>Atur bentuk huruf</TITLE>
</head>
<body>
<FONT FACE=”VERDANA”> Teks ini jenis hurufnya verdana </FONT>
</body>
</html>

Untuk mengatur bentuk huruf yang akan digunakan, kita berikan atribut FACE di dalam tag <FONT>. Nilai berupa nama bentuk huruf.

Format penulisannya :
<FONT FACE=”VERDANA”> Teks ini jenis hurufnya verdana </FONT>

Tag HTML yang mengatur bentuk & ukuran huruf.

<html>
<head>
<title>Atur ukuran huruf</title>
</head>
<body>
<FONT SIZE=5> Teks ini ukuran hurufnya 5 </FONT>
</body>
</html>

Untuk mengatur ukuran huruf yang akan digunakan, kita berikan atribut SIZE di dalam tag <FONT>. Nilainya berupa angka 1(terkecil) sampai 7 (terbesar) sesuai yang diinginkan.

Format penulisannya :
<FONT SIZE=6> Teks ini ukuran hurufnya 6 </FONT>

Mengatur Warna Huruf

Contoh perintah (tag) HTML yang digunakan untuk mengatur warna huruf.

<html>
<head>
<TITLE>Atur warna huruf</TITLE>
</head>
<body>
<FONT COLOR=”RED”> Teks ini warnanya merah </FONT>
</body>
</html>

Untuk mengatur bentuk huruf yang digunakan, berikan atribut COLOR di dalam tag <FONT>. Nilainya berupa nama warna yang diinginkan.

Format penulisannya :
<FONT COLOR=”RED”> Teks ini warnanya merah </FONT>

Memberi Jarak Antar Baris

Perintah HTML yang mengatur jarak antar baris.

<html>
<head>
<TITLE>Memberi jarak antara baris</TITLE>
</head>
<body>
Teks pada baris pertama<BR>
Teks pada baris kedua
</body>
</html>

Tag membuat jarak antar baris <BR>. yang berfungsi sebagai ENTER pada tampilan homepage.

Format penulisannya :
<body>
Teks pada baris pertama<BR>
Teks pada baris kedua
</body>


Mengatur Perataan Kalimat
Perintah (tag) HTML yang digunakan untuk mengatur perataan kalimat.

<html>
<head>
<TITLE>Mengatur perataan kalimat</TITLE>
</head>
<body>
<P ALIGN=”CENTER”>
Teks dalam satu paragraf ditampilkan rata tengah
</body>
</html>

Untuk membuat paragraf digunakan tag <P>. Di dalam tag tersebut dapat kita sisipkan atribut pengatur perataan kalimat, antara lain :
- LEFT (tampilan paragraf rata kiri)
- RIGHT (tampilan paragraf rata kanan)
- CENTER (tampilan paragraf rata tengah)
- JUSTIFY (tampilan paragraf rata kanan-kiri)

Format penulisannya :
<body>
<P ALIGN=”CENTER”>
Teks dalam satu paragraf yang akan ditampilkan dalam perataan tengah
</body>

Mengatur Dekorasi Teks
Dekorasi teks digunakan untuk mengatur cetakan teks apakah pada tampilan browser akan tercetak tebal, miring dan sebagainya. Berikut ini macam-macam tag untuk dekorasi teks.

GAMBAR TABEL BOLD ITALIC UNDERLINE

Contoh perintah (tag) HTML untuk mengatur dekorasi teks.

<html>
<head>
<TITLE>Mengatur dekorasi teks</TITLE>
</head>
<body>
<B>Teks dalam satu paragraf yang akan ditampilkan dengan keadaan tercetak tebal</B>
</body>
</html>

Format penulisannya :
<html>
<body>
<B>Teks dalam satu paragraf yang akan ditampilkan dengan keadaan tercetak tebal</B>
</body>
</html>

Pembuatan Garis Horisontal

Untuk membuat tanda pemisah berupa garis, gunakanlah tag <HR>.
Beberapa atribut yang digunakan adalah :

GAMBAR AUTAN GARIS

Posisi standar untuk <HR> adalah ditengah.

<html>
<head>
<title>Membuat Garis Pemisah</title>
</head>
<body>
<br>
<HR ALIGN=”left” WIDTH=”75%”>
<HR ALIGN=”right” SIZE=”4” WIDTH=”200”>
<HR SIZE=”5” COLOR=”#808080” WIDTH=”50”>
</body>
</html>

Artikel Terkait Lainnya :



3 comments:

  1. ini postingan yg sangat bermanfaat bagi sy krn sdng belajar html,..mksh sdh dishare.. sukses selalu :)

    ReplyDelete