Menempatkan Gambar Di Tengah Layar Monitor
Mawan A. Nugroho, 30 Sep 2012 20:05:55 WIB
Banyak disainer web / programmer web pemula bertanya kepada saya, "Bagaimana cara menempatkan gambar agar berada di tengah-tengah layar monitor?" Jawabannya: Gunakan CSS. Yang harus anda lakukan adalah menghitung ukuran gambar tersebut (lebar dan tinggi) lalu dibagi dua. Hasil pembagian jadikan parameter untuk margin-left dan margin top. Untuk lebih jelasnya, silakan lihat contoh berikut ini.
<html>
<head>
<title>Under construction</title>
</head>
<body bgcolor="black">
<div style="position:fixed; top:50%; left:50%; margin-top: -163; margin-left:-320">
<img src="under-construction.jpg" width="640" height="327" border="0" />
</div>
</body>
</html>
Hasilnya dapat dilihat di sini.
Mungkin anda juga bertanya, "Bagaimana jika gambarnya di kanan bawah? Mudah saja. Ini dia...!!!
<html>
<head>
<title>Under Construction</title>
<style type="text/css">
body
{
background-image:url('under-white.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:right bottom;
}
</style>
</head>
<body>
<p>Maaf, situs web ini sedang dalam tahap pembangunan.</p>
</body>
</html>
Share on:
Belum ada komentar untuk artikel ini.
Tambah komentar singkat.
Perhatikan!
- Komentar anda baru dapat dilihat oleh umum setelah mendapat persetujuan dari Administrator.
- Untuk membendung serbuan spam, satu orang hanya boleh mengirimkan 5 komentar perhari. Jumlah komentar anda hari ini: 0 komentar.
- Nama ibukota negara kita adalah nama kota yang terletak di antara kota Tangerang dan Bekasi, tujuh karakter.
Pay attention please!
 |
|
|
|
 |
|||
 |
Administrator |  |
|
 |
|||
|
|
|
|
 |
|||
|
|
|
|
||
|
Unique Visitors | |
|
||
|
1225464 sejak 26 Mei 2010. IP addr anda:Atau rata-rata sekitar 241 pengunjung perhari. 172.70.130.105 |
|
|
||
|
|
|
|
||
|
|
|
|
||
|
Mawan A. Nugroho Promote Your Page Too |
|
|
||
|
|
|
|
||
|
Mawan's Net | |
|
||
|
MbahDukun.com |
|
|
||
|
|
|
|
||
|
MKom UBL 10 | |
|
||
|
|
|
|
||
 |
