MENGGABUNGKAN GAMBAR DAN TEKS

Oleh
TKJ - Pemrograman Web

Assalamualaikum Wr. Wb.
Selamat pagi/siang/sore/malam... Kali ini saya akan menjelaskan tentang menggabungkan gambar dan teks.
- Menggabung atau menyisipkan gambar didalam suatu teks atau paragraf tertentu. Terdapat pilihan posisi gambar yang harus diperhatikan.
- Secara Vertikal:
   1. Teks bisa berada sejajar dengan bagian atas gambar.
   2. Teks bisa berada sejajar dengan bagian tengah gambar.
   3. Teks bisa berada sejaja dengan bagian bawah gambar.
- Untuk posisi gambar yang dilihat dari arah vertikal dapat ditentukan dengan mengisi nilai TOP, MIDDLE, atau  BOTTOM, kedalam atribut ALIGN yang terdapat pada tag <img>.
Berikut contoh coding menggabungkan gambar dan teks secara vertikal.

<!DOCTYPE HTML>
<html>
<body>
<h1>Menggabungkan gambar dan teks, posisi terhadap teks secara vertikal</h1>
<p><img scr="logosmkn2.jpg" width=150 align=TOP>logo 2 (menggunakan align=TOP)<br><br>
<p><img scr="logosmkn2.jpg" width=150 align=MIDDLE>logo 2 (menggunakan align=MIDDLE)<br><br>
<p><img scr="logosmkn2.jpg" width=150 align=BOTTOM>logo 3 (menggunakan align=BOTTOM)<br><br>
</body>
</html>

 Berikut hasil dari coding di atas.

Menggabungkan gambar dan teks, posisi terhadap teks secara vertikal

logo 2 (menggunakan align=TOP)


logo 2 (menggunakan align=MIDDLE)


logo 3 (menggunakan align=BOTTOM)

Sceenshot:






Sekian post kali ini, terima kasih yang sudah berkunjung dan semoga bermanfaat.
See you next time...

Komentar

Posting Komentar

Postingan populer dari blog ini

SAMBA SERVER - Installasi, Konfigurasi, dan Pengujian

Oleh
Gambar
Assalamualaikum Wr. Wb... Selamat pagi/siang/sore/malam... Pada post kali ini saya akan membahas bagaimana cara installasi SAMBA SERVER dan bagaimana cara konfigurasi beserta pengujiannya apabila berhasil. Check it out... . . . . A. INSTALLASI SAMBA SERVER Pertama yang harus kalian lakukan tentu saja login ke Debiannya, tapi disini kalian harus login sebagai root . Jika sudah login, selanjutnya untuk install Samba Server ketik apt-get install samba  dan tekan Enter. Ketk Y dan tekan Enter untuk melanjutkan. Masukkan CD atau ISO debian dan tekan Enter untuk melanjutkan installasi samba server. Tunggu hingga proses selesai. B. KONFIGURASI SAMBA SERVER Jika sudah selesai, ketik nano /etc/samba/smb.conf  untuk edit konfigurasi file samba server yang smb.conf Jika sudah masuk ke dalam smb.conf   pergi ke bagian paling bawah dan tambah kan script seperti berikut. Jika sudah selesai, save dengan cara tekan CTRL + X. Lalu tekan Y ....
Baca selengkapnya

STANDAR PENGKABELAN EIA 586

Oleh
Gambar
Assalamualaikum Wr. Wb.... Selamat pagi/siang/sore/malam... Jumpa lagi di Blog saya ONE-X INFORMATION. Pada post kali ini saya akan membahas tentang Standar Pengkabelan EIA 586. Mari langsung saja kita masuk ke pembahasan berikut. Check this out... Standar Pengkabelan EIA 586 UTP       Bagi yang belum tahu kabel UTP ini adalah media transmisi yang terdiri dari 4 pasang kawat. Kabel UTP digunakan dalam berbagai jaringan. Masing-masing dari delapan kabel tembaga individu dalam kabel UTP ditutupi oleh bahan isolasi. Selain itu, kabel di setiap pasangan yang melilit satu sama lain.         Kabel UTP memiliki empat pasang dengan ukuran kawat tembaga 22 atau 24 gauge (gauge merupakan standart pengurkuran kabel). Salah satu faktor yang membedakan kabel UTP dengan kabel lain salah satunya kabel UTP memiliki impedansi 100 ohm. meskipun dahulu kabel UTP dikatakan memiliki kecepatan transfer yang lambat, namun dalam perk...
Baca selengkapnya

LAYOUT HALAMAN WEB LEFT INDEX, LAYOUT INDEX, & ALTERNATING INDEX

Oleh
Assalamualaikum Wr. Wb. Selamat pagi, siang, sore, malam. Pada kali ini saya akan menunjukkan contoh Coding Layout Halaman Web Left Index , Layout Split , dan Alternating Index beserta hasilnya . Berikut codingnya... Left Index. <html> <body> <head> <title>Left Index</title> <form id="form1" name="form1" method="post" action=""> <table width="825" height="447" border="1" cellspacing="1"> <tr> <td width="160" rowspan="4" align="center" valign="top" bgcolor="#993366"><b> <p>Home</p> <p>Profile</p> <p>About Us</p> <p>Blog</p> <p>Contact Us</p></b> </tr> <th width="627" height="100" align="center" bgcolor="#FFFF99"><strong><font color="#CCCCCC" size="+4...
Baca selengkapnya