Membuat Menu bar Part 2
Eeeee. ....... ada lanjutannya nie........
Sabar ya , scriptnya rada panjang tapi yang penting tinggal copy paste kalo ga mau repot . Klo maw nanya ya mangga tanya , yang mau ralat yang ralat tulisannya klo bisa ( hehehehehe .... jangan ada dusta di antara kita ....)
Kembali ke topik . Tinggal copy paste code dibawah ( klo tega ) :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Menubar</title>
<link rel="stylesheet" type="text/css" href="menubar.css" />
</head>
<body>
<ul>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
</ul>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Menubar</title>
<link rel="stylesheet" type="text/css" href="menubar.css" />
</head>
<body>
<ul>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
<li><a href="#">CONTOH</a></li>
</ul>
</body>
</html>
Lalu save dengan nama : menubar.html , nah ini script CSS nya :
/* CSS Document */
/* Css file ini dibuat oleh
bagus20972@yahoo.com
meng-copy secara ilegal
tidak akan diberi sanksi
tapi dosa tanggung sendiri :D*/
ul{
list-style-type:none;
}
ul li{
display:inline;
float:left;
}
a {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
display:block;
width:100px;
height:20px;
padding:10px;
text-align:center;
text-decoration:none;
background-color:#040404;
color:#A4A4A4;
}
a:hover, a:active{
background-color:#919191;
color:#060606;
}
/* Css file ini dibuat oleh
bagus20972@yahoo.com
meng-copy secara ilegal
tidak akan diberi sanksi
tapi dosa tanggung sendiri :D*/
ul{
list-style-type:none;
}
ul li{
display:inline;
float:left;
}
a {
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
display:block;
width:100px;
height:20px;
padding:10px;
text-align:center;
text-decoration:none;
background-color:#040404;
color:#A4A4A4;
}
a:hover, a:active{
background-color:#919191;
color:#060606;
}
lalu save dengan nama menubar.css pada folder yang sama , kode pun telah jadi !!!
Jalankan menubar.html pada browser anda dan lihat and saksikan .......
Wkwkwkwwk .......
Penjelasannya nanti dlu ya , cape nulis n scripting ......