background-image : no-repeat dan set-position
Anda bisa mengatur CSS agar gambar background tidak diulang-ulang.
Anda juga bisa mengatur CSS agar gambar background tampil pada posisi yang anda inginkan.
body
{
background-image:url("pattern.gif");
background-repeat:no-repeat; background-position:right bottom;
}
{
background-image:url("pattern.gif");
background-repeat:no-repeat; background-position:right bottom;
}
Codingku HTML Editori
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body
{
background-image:url("pattern.gif");
background-repeat:no-repeat;
background-position:right top;
}
</style>
</head>
<body>
<h1>background tidak diulang dan diposisikan pada bagian kanan atas</h1>
</body>
</html>
Note: "Berdasarkan aturan dari W3C bila anda mendifinisikan
color sebuah elemen maka anda juga harus mendefinisikan
background-color dari elemen tersebut".Text Alignment
Text alignment digunakan untuk mensejajarkan barisan teks.
Teks di html bisa disejajarkan ke sebelah kanan, tengah maupun kiri.
Ketika
text-align di set sebagai "justify" maka setiap baris tulisan memiliki
lebar yang sama dan margin kanan dan kiri sama-sama lurus (seperti
tulisan-tulisan di dalam koran dan majalah).
h1{text-align:center;}
p.tanggal{text-align:left;} /* CSS class */
p#isi{text-align:justify;} /* CSS id */
Codingku HTML Editori
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
h1{text-align:center;}
p.tanggal{text-align:left;} /* CSS class */
p#isi{text-align:justify;} /* CSS id */
</style>
</head>
<body>
<h1>Judul Tulisanku</h1>
<p class="tanggal">22 juni 2012</p>
<p id="isi">Janganlah kamu pandang sama antara orang yang baik
dan orang yang buruk, karena itu akan melemahkan semangat orang-orang
yang suka berbuat baik dan memicu keberanian orang-orang yang berbuat
jahat.</p>
<p><b>catatan : </b>resize browser anda untuk melihat bagaimana justify bekerja</p>
</body>
</html> 
0 komentar:
Post a Comment