Karakter Khusus
Berikutnya, saya ingin menginformasikan
anda bahwa ada beberapa karakter khusus dalam file HTML. Beberapa yang sering
digunakan antara lain:
Pengertian HTML
Pengertian HTML Jika anda ingin mempelajari bagaimana cara membuat website, langkah pertama adalah...
Menyisipkan Gambar Pada HTML
Baik, kini saya akan memberikan tutorial tentang cara menyisipkan gambar dalam situs anda.Perintah untuk...
Mengubah Warna Text Pada HTML
Mengubah Warna Text pada Tag Body Pada Link yang ada pada HTML, dapat anda lihat...
Membuat Link Pada HTML
Anda melihat bahwa tag tersebut diawali dengan A yang merupakan singkatan dari Anchor, kemudian HREF...
Heading Text
Heading Text Anda juga dapat mengubah ukuran huruf dengan tag heading, yaitu...
Minggu, 24 September 2017
Karakter Khusus dalam HTML
Cara Mengubah Warna Text dalam HTML
Mengubah Warna Text pada Tag Body
Pada Link yang ada pada HTML, dapat anda lihat bahwa sebelum diklik, link akan berwarna biru dan setelah diklik warnanya berubah menjadi ungu.
Sebenarnya pewarnaan tersebut dapat anda modifikasi dengan tag <BODY>. Bahkan tag <BODY> ini dapat memodifikasi beberapa hal menarik lainnya.
<HTML>
<BODY>
<BODY>
Ini file HTML pertama saya. Klik "back button" pada browser untuk kembali.
</BODY>
</HTML>
</HTML>
Pada kode di atas anda melihat tag <BODY>. Untuk memodifikasinya kita bisa memberi atribut pada tag <BODY> tersebut, contohnya yaitu :
<BODY BGCOLOR="#FFFF66" TEXT="#0066FF" LINK="#66FF66" VLINK="#FF0000" ALINK="#FFFFFF">
BGCOLOR akan mengubah warna latar belakang, TEXT akan mengubah warna teks yang ditulis, LINK akan mengubah warna link sebelum diklik, VLINK akan mengubah warna link setelah diklik, dan ALINK akan mengubah warna link aktif (artinya saat bekas kursor masih berada di link itu). Sedang mengenai warna, berikut adalah kode yang sering digunakan:
#FFFFFF adalah putih
#FFFF66 adalah kuning
#FF66FF adalah ungu
#FF0000 adalah merah
#66FF66 adalah hijau
#0066FF adalah biru
#00000 adalah hitam
#FFFF66 adalah kuning
#FF66FF adalah ungu
#FF0000 adalah merah
#66FF66 adalah hijau
#0066FF adalah biru
#00000 adalah hitam
Anda dapat mencoba memvariasikan sendiri kombinasi 6 angka di atas untuk memperoleh warna lainnya. Bisa dilihat di Google untuk kode-kode lainnya.
Cara Memasukkan Link dalam HTML
Memberi Link dalam HTML
Perintah untuk membuat link adalah dengan <A HREF="http://www.google.com">Nama Link</A>.
Anda melihat bahwa tag tersebut diawali dengan A yang merupakan singkatan dari Anchor, kemudian HREF (hypertext reference), yang setelah itu dilanjutkan alamat yang dituju. Perlu diingat alamat yang dituju ini harus berada di antara tanda petik. Setelah itu anda menuliskan nama link-nya - bebas terserah anda, dan terakhir menutup dengan tag </A>. Demikianlah cara membuat link.
Contoh Link di atas akan membawa anda ke situs dengan alamat: http://www.google.com.
Link tidak harus menuju ke alamat situs lain, tapi dapat juga diarahkan ke alamat imel. Sebagai contoh adalah link berikut, yang kalau anda klik akan membuka software untuk mengirim imel dan mengirim ke alamat email yang dituju.
Perbedaan link untuk email dan link ke alamat situs adalah, untuk link email ada kata mailto sebelum alamat email. Link di atas saya tulis dengan menggunakan perintah:
<A HREF="mailto:ardionoa22699@gmail.com">Mengirim email</A>
Dari contoh-contoh link di atas, dapat anda lihat bahwa sebelum diklik, link akan berwarna biru dan setelah diklik warnanya berubah menjadi ungu.
<A HREF="mailto:ardionoa22699@gmail.com">Mengirim email</A>
Pemakaian link berikutnya adalah untuk membawa kursor ke posisi tertentu dalam sebuah halaman. Maka kursor akan berpindah ke tulisan di bawah yang menerangkan tentang karakter khusus. Untuk link seperti ini bentuk yang digunakan adalah "<A HREF="#tujuan">Link yang dimaksud</A>". Dan posisi yang dituju ditandai dengan "<A NAME="tujuan"> Posisi yang dituju</A>". Bentuk HTMLnya seperti ini:
<HTML>
<BODY>
<BODY>
komentar bebas
.
.
.
.
.
.
<A HREF="#tujuan">Link asal</A>
komentar bebas
.
.
.
.
.
.
<A NAME="tujuan">Posisi tujuan</A>
komentar bebas
.
.
.
.
.
.
</BODY>
</HTML>
</HTML>
Heading Text dalam HTML
Heading Text
Anda juga dapat mengubah ukuran huruf dengan tag heading, yaitu <H1> sampai <H6>, di mana <H1> adalah yang terbesar, dan <H6> adalah yang terkecil. Perhatikan contoh berikut:
Terakhir, dalam memanipulasi tulisan, anda harus mengenal tiga tag berikut:
1. <CENTER> Tag ini berfungsi membuat tulisan berada di tengah.</CENTER>
2. <BR>: Tag ini berfungsi untuk membuat baris baru.
3. <P>: Tag ini berfungsi untuk membuat paragraf baru.</P>
3. <P>: Tag ini berfungsi untuk membuat paragraf baru.</P>
Tag <P> mempunyai atribut align, seperti <P align="left"> yang membuat paragraf menjadi rata kiri, <P align="right"> yang membuat paragraf menjadi rata kanan dan <P align="center"> membuat paragraf menjadi berada di tengah.
Cara Memanipulasi Text dalam HTML
Memanipulasi Text dalam HTML
Dalam membuat suatu HTML, pertama kali yang Anda harus hafal adalah:
<HTML>
<HEAD>
<BODY>
<BODY>
Ini file HTML pertama saya
</HEAD>
</BODY>
</HTML>
</HTML>
Dimulai
dengan tag <HTML>, kemudian dilanjutkan dengan tag <BODY>,
setelah itu "isi". Dan terakhir ditutup dengan dua tag berikut,
</BODY> dan </HTML>. Harus ada tanda "/" pada setiap tag
penutup. Diantara tag <TITLE> Isi Judul </TITLE> bisa diisi
dengan text yang nantiny akan menjadi judul.
Buka
notepad Anda dan ketik ulang kode di atas. Kemudian simpan/save dengan
format html, contohnya simpan dengan nama file1.html. Setelah itu buka
file tersebut dengan browser Anda.
Maka akan keluar tampilan seperti dibawah ini:
Seperti
anda lihat di atas, kode-kode dalam file HTML selalu dibatasi oleh tag
< ... >. Untuk membuat tulisan mejadi tebal / miring / digaris
bawahi, gunakan tag:
<B>Untuk membuat huruf tebal.</B>
<I>Untuk membuat huruf miring.</I>
<U>Untuk membuat garis bawah.</U>
<I>Untuk membuat huruf miring.</I>
<U>Untuk membuat garis bawah.</U>
Anda juga dapat mengubah ukuran dan warna teks dengan tag:
<FONT SIZE="bebas" COLOR="bebas" face="bebas">
Teks Anda
</FONT>.
Di
sini size adalah ukuran huruf, color adalah warna yang anda inginkan
dan face adalah jenis font yang digunakan. Anda dapat menggabung lebih
dari satu tag sekaligus, sebagai contoh
<B><U>akan membuat huruf tebal yang bergaris bawah</U></B>.
Hanya jangan lupa jika tag pembuka berada di dalam, maka tag penutupnya
juga sebaiknya di dalam, seperti tag <U> di atas. Baik kita lihat
kembali contoh berikut:
Untuk Warna Text:
(Warna
Merah) <FONT COLOR="red">Ini warna merah.</FONT>(Warna
Biru) <FONT COLOR="blue">Ini warna biru.</FONT>(Warna
Hijau) <FONT COLOR="green">Ini warna hijau.</FONT>(Warna
Kuning) <FONT COLOR="yellow">Ini warna kuning.</FONT>
Untuk Ukuran Text:
(Ukuran 1) <FONT SIZE="1">Ini ukuran 1.</FONT>
(Ukuran 2) <FONT SIZE="2">Ini ukuran 2.</FONT>
(Ukuran 3) <FONT SIZE="3">Ini ukuran 3.</FONT>
(Ukuran 4) <FONT SIZE="4">Ini ukuran 4.</FONT>
(Ukuran 5) <FONT SIZE="5">Ini ukuran 5.</FONT>
(Ukuran 6) <FONT SIZE="6">Ini ukuran 6.</FONT>
(Ukuran 7) <FONT SIZE="7">Ini ukuran 7.</FONT>
Untuk model font:
<FONT FACE="Arial">Ini memakai font arial.</FONT>
<FONT FACE="Arial Black">Ini memakai font arial black.</FONT>
<FONT FACE="Comic Sans MS">Ini memakai font comic sans MS.</FONT>
<FONT FACE="Courier New">Ini memakai font courier new.</FONT>
<FONT FACE="Helvetica">Ini memakai font helvetica.</FONT>
<FONT FACE="Impact">Ini memakai font impact.</FONT>
<FONT FACE="Times New Roman">Ini memakai font times new roman.</FONT>
<FONT FACE="Verdana">Ini memakai font verdana.</FONT>
<FONT FACE="Arial Black">Ini memakai font arial black.</FONT>
<FONT FACE="Comic Sans MS">Ini memakai font comic sans MS.</FONT>
<FONT FACE="Courier New">Ini memakai font courier new.</FONT>
<FONT FACE="Helvetica">Ini memakai font helvetica.</FONT>
<FONT FACE="Impact">Ini memakai font impact.</FONT>
<FONT FACE="Times New Roman">Ini memakai font times new roman.</FONT>
<FONT FACE="Verdana">Ini memakai font verdana.</FONT>
Bisa digabungkan seperti ini:
<FONT
SIZE="4" FACE="Comic Sans MS" COLOR="green"><B> Ini huruf
tebal, memakai font Comic Sans MS, berukuran 4, berwarna
hijau. </B></FONT>
