Senin, 20 April 2015

HTML Image (3) : Mengatur perataan (alignment) pada gambar

Html dapat mengatur perataan gambar. mungkin anda pernah melihat artikel sebuah Koran dimana gambar terdapat di bagian kiri dan tulisan yang menjelaskan gambar tersebut berada di bagian kanan. Seperti itulah fungsi perataan gambar. Untuk melakukan itu semua kita kita memerlukan attribute align yang sebelumnya sudah pernah kita bahas pada bagian paragraf. Kita akan ulas align kembali pada tag image pada html.



Jika suatu tag <img> tidak di beri sebuah perataan (align) , maka ketika terdapat suatu teks hasilnya seperti berikut :


Mari kita coba menggunakan align, pada align terdapat nilai left, center, right.

Contoh : image_align.html

<html>
<head>
<title>Image Align</title>
</head>
<body>
<img src="Desert.jpg" width="300" align="left">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt
ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt
ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt
ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam,
quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
</p>
</body>
</html>

Hasil keluaran browser :


Anda dapat mencoba menggunakan nilai right atau center pada align.


Tidak ada komentar:

Posting Komentar