Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Mengganti posisi
maaf saya ingin gambar nya kesamping dan di bawah gambar masing" ada text,bgmna ya min..?
7 Jawaban:
maksudya ke samping dari kiri ke kanan min,bukan dari atas ke bawah,itu memakai kode apa ya min ..?,saya pake float:left; ttp g bisa
Kalau gambar dia sebenernya otomatis, karena dia displaynya inline ( otomatis sebaris). Kecuali dia dibungkus dalam div, baru kita pake float, tapi float sendiri ga cukup, karena div dia otomatis 100% lebarnya (selebar browser), jadi harus kita atur lebarnya boleh pake pixel boleh pake persen
/*--contoh --*/
namadiv{
float:left;
width:30%;
}
Untuk lebih paham masalah posisi, kita harus belajar float + clear dan konsep display (inline dan block).
oooh begituu,trimakasih atas pnjelasannya @hilman
tapi, bukannya gambar bersifat block bang..??,kalau boleh tau apa saja yg bersifat block dan inline bang..?
malah jadi ilang semua bang,
<head>
<style>
*{padding:0; margin:0;}
html {
background: url(kantor.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
h2{text-align:center;font-size:40px; color:yellow;}
h1,h2{
text-shadow:10px 10px 10px red;}
a{text-decoration:none; color:red;}
h1{position:fixed; }
h2{text-align:center;}
#gambar{width:30%; float:left;}
p{color:yellow; font-size:25px;}
</style>
</head>
<body>
<div id="gambar">
<h1><a href="http://localhost/fadhilsanad/index.html">DewataSoft</a></h1>
<h2>Tentang Kantor</h2>
<img "src="kantor1.jpg">
<p>kantor dalam</p>
<img"src="kantor.jpg">
<p>kantor belakang</p>
</div>
Karena semuanya dibungkus dalam div, teknik yang diatas cuman gambarnya aja yang dibungkus bukan semuanya