Tak Pernah Sempurna: Desember 2008

Sering lihat tag span. Tapi belum juga paham tata cara penggunaannya. Yak, di coba saja, lah .... :)
<html>
<head>
<style type="text/css">
span
{
float:left;
width:0.7em;
font-size:500%;
font-family:algerian,courier;
line-height:80%;
}
</style>
</head>

<body>
<p>
<span>T</span>his is some text.
This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</p>

<p>
In the paragraph above, the first letter of the text is embedded in a span element.
The span element has a width that is 0.7 times the size of the current font.
The font-size of the span element is 400% (quite large) and the line-height is 80%.
The font of the letter in the span will be in "Algerian".
</p>

</body>
</html>

Hasilnya =

Gambar bunga-bunga dan burung abaikan saja yak.... Itu hanya dekorasi hasil editan. :p

Dulu waktu mulai belajar HTML, aq merasa dimudahkan dengan adanya frame HTML. Beberapa web page dapat ditampilkan dalam satu window browser karena window browser tersebut dibagi menjadi beberapa frame.

Tapi kemudian ada pengetahuan lain bahwa mesin pencari (macam google, yahoo, dll) lebih sulit jika harus melacak kata yang terletak di dalam tabel dan atau frame. Lah, jadi gimana seharusnya klo gak boleh pakai frame?

Setelah sekian lama, akhirnya tahu juga cara agar mesin pencari tidak kesulitan melacak kata di page kita. Ya, memang semua hal ada caranya. Mungkin hanya kita yang tidak tahu caranya saja, atau kita tidak bersabar mendapatkan petunjuk-Nya. =)) (Nertawain diri mode oN.)

Back to topic, jika tidak ingin memakai frame di page kita, bisa memakai tag div. Tag div ini mendefinisikan suatu bagian (section) dalam suatu dokumen. Sekarang tahulah mengapa blog-blog yang ada memakai tag div. Masalah satu selesai, disusul masalah yang lain, yaitu, meski pun sekarang tahu kegunaan tag div, tapi tidak mengerti tata cara penggunaannya. =))

Setelah ngepék buku dan nyonto internet, yak... saatnya trial & error.... :D

Kode htmlnya:
<html>
<head>
<title>Tak Pernah Sempurna</title>
<style type="text/css">
div.kontener{
width: 600px;
margin:0px;
border:1px solid green;
line-height:150%;
}

div.kepala,div.kaki
{
text-align: center;
padding:0.5em;
color:white;
background-color: green;
}

div.satu {
float: left;
width:100px;
margin: 0;
padding: 1em;
}

div.dua{
float: left;
width: 100px;
border-left:1px solid green;
padding:1em;
}

div.tiga{
margin-left: 300px;
border-left:1px solid green;
padding:1em;
}

</style>
</head
<body>
<div class='kontener'>
    <div class='kepala'> =) Bismillah (= </div> 
    <div class='satu'>11111111111</div>
    <div class='dua'>222222222222</div>
    <div class='tiga'>333333333333</div>
    <div class='kaki'>copyleft 2008 agn3z </div> 
</div>
</body>
</html>

Hasilnya:

Que1. Bingungkah?
Ans1. Ya klo gitu silakan diutak-atik sendiri, karna aq juga sama bingungnya. :)>-

Que2.Loh, jadinya kok gak sama?
Ans2. Ya, iya, laah.... Gambarnya khan udah ku edit. =))

Tak Pernah Sempurna

Blog Archive

Pelihara Ikan

Rabu, 24 Desember 2008

Tag <Span>

Senin, 15 Desember 2008

Tag <div> Pengganti Frame

Label

Kalender

Kamus

Cuap-Cuap