2 5
Gambar 3.5 Tampilan hasil halaman web Penjelasan : scrit diatas menggunakan pewarnaan pada font dan body. Menggunakan
kode warna html. Script diatas juga menerapkan align dan heading 3 untuk ukuran font. Script diatas adalah contoh dari gabungan beberapa aspek yang telah dibahas pada script
sebelum- sebelumnya. Pada dokumen ini menggunakan 2 warna. Untuk pewarnaan ada beberapa warbna yang kodenya dituliskan dengan huruf biasa da nada juga yang
menggunakan perpaduan imbol, huruf dan angka. Untuk warna merah kode htmlnya adalah
= FF0000
.
Masih banyak lagi kode kode warna dalam html, dapat diatur sesuai keinginan untuk pewarnaan dalam html karena sudah banyak tersedia daftar list kode-
kode warna yang bisa digunakan.
7. Bekerja dengan Gambar
body p
-- menggunakan path relative -- img
src =
exo.jpg width
= 100
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore er dolore magna
aliqua. hr
p -- menggunakan path absolute --
img src
= http:localhostprak1exo.jpg
width =
100 align
= right
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore er dolore magna
aliqua.
body
Gambar 3.6 kode HTML
2 5
Gambar 3.7 Tampilan hasil halaman web Penjelasan : pada script diatas disisipkan gambar pada masing- masing paragraph. Script
diatas terdiri dari 2 paragraf yang didalamnya terdapat sebuah gambar. Untuk menyisipkan gambar sesudah atau setelah paragraph dapat diatur sesuai yang diinginkan. Jika ingin
mennampilkan gambar terlebih dahulu maka script gambar dituliskan terlbeih dahulu baru script paragraph, dan begitu sebaliknya. Untuk pengaturan posisi gambar juga dapat
menggunakan align. Untuk menyisipkan gambar jangan lupa format penulisan file direktori tempat penyimpanan dan nama file harus benar. Kemudian untuk mengubah
lebar dan panjang gambar dapat diatur dengan menambahkan “width=”100”” misalnya ingin mengubah gambar menjadi 100px.
8. Menggunakan Link
Link 1 :
DOCTYPE html html
lang =
en
head title
Demo Link title
head body
a href
= link2.html
klik disini a
body html
Link 2: DOCTYPE html
html lang
= en
head title
Demo Link 2 title
head body
2 5
Untuk kembali ke halaman pertama
a href
= link1.html
klik disini a
body html
Gambar 3.8 Kode HTML
Gambar 3.9 Tampilan hasil halaman web Penjelasan : script diatas menunjukkan cara untuk link antar dokumen. Setiap teks
adalah link, ditunjukkan dengan teks bergaris bawah dan bergambar tangan ketika kursor mouse menunjuk teks tersebut. Menggunakan atribut href yang fungsinya untuk
menunjuk pada dokumen atau bagian dokumen yang dituju oleh LINK tersebut.
9. Atribut Link
DOCTYPE html html
lang =
en
head title
Demo Atribut Link title
head body
a href
= link2.html
target =
_blank title
= Title link
klik disini
a body
html
Gambar 4.0 Kode HTML
Gambar 4.1 Tampilan hasil web
2 5
Penjelasan : script diatas menunjukkan cara untuk link antar dokumen. Setiap teks
adalah link, ditunjukkan dengan teks bergaris bawah dan bergambar tangan ketika kursor mouse menunjuk teks tersebut. Menggunakan atribut href yang fungsinya untuk
menunjuk pada dokumen atau bagian dokumen yang dituju oleh LINK tersebut. Sama seperti script sebelumnya, namun pada script ini tidak menggunakan 2 file html,
dijadikan satu dalam 1 file html kemudian nantinya ketika diload tetap menuju file html yang dituju. Perbedaannya pada script html diatas dituliskan target file yang akan dituju.
10. Link Internal