Bagaimana caranya memasukan image tersebut kedalam HTML?
Untuk memasukan image yang kita inginkan, menggunakan element IMG. IMG berfungsi untuk menampilkan gambar, element ini tidak mempunyai tag penutup dan mempunyai attribute yaitu:
1. align, untuk posisi gambar tersebut. Akan kita posisikan rata ke kanan, kiri, atas, atau bawah.
2. alt, untuk memberikan teks alternatif pada gambar.
3. Border, untuk jarak dengan batas
4. height, width, untuk ukuran panjang dan lebar gambar.
4. hspace untuk jarak kosong posisi horizontal, vspace untuk jarak kosong posisi vertikal.
4. src adalah source atau sumber atau lokasi dari gambar itu disimpan beserta nama filenya.
Berikut Sintaks:
<img
align="left"|"right"|"top"|"middle"|"bottom"
alt="text"
border="pixel"
width="pixel"|"%"
height="pixel"|"%"
hspace="pixel"
vspace="pixel"
src="uri">
Contoh :
Misalnya kita akan menampilkan gambar image01.jpg dengan ukuran width dan height 160pixel dan border 8pixel :
Berikut penulisannya :
<html>
<head>
<title>Memasukan gambar </title>
</head>
<body>
<img width="160" height="160" src="image01.jpg">
</body>
</html>
Bagaimana menghubungkan link?
Diperlukan element A yang berfungsi untuk menghubungkan ke internal ataupun eksternal halaman web. Element ini mempunyai attribute href, name, dan target. Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal halaman web. Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru.
Berikut Sintaksnya:
<a href="uri" name="name" target="_blank"|"parent"|"_top"|"_self">
...........................
</a>
Contoh :
Kita akan membuat link ke media sosial FB, twitter, dan gmail.
Berikut penulisannya :
<html>
<head>
<title>ini namanya judul</title>
</head>
<body>
<ol>
<a href="http://www.facebook.com">facebook</a>
<a href="http://www.twitter.com">twitter</a>
<a href="http://www.gmail.com">gmail</a>
</ol>
</body>
</html>
Sekian, Terimakasih.
Comments