..::: 4F1L News :::..: Membuat Tombol keren Dengan CSS dan HTML

Tuesday, November 22, 2011

Membuat Tombol keren Dengan CSS dan HTML

Jika Teman-Teman Tidak Keberatan Tolong Di Like Pages Facebook Saya Ya Terima Kasih Sebelumnya

Membuat sebuah tombol HOVER dengan CSS dan HTML ternyata cukup unik dan
Sekarang saat nya membongkar kembali file file sebelumnya yang kita punya,dan kita perindah website kita yaitu Membuat Tombol keren Dengan CSS dan HTML. cara nya sebagai berikut :

---> Pertama tama siapkan image atau gambar yang nantinya akan kita buat sebagai background pada teks tombol Kalo belum bisa membuat nya atau sedang malas bisa di download DISINI beserta script yang telah jadi :

Ok langsung kita persiapkan semuanya sebagai berikut :

---> Buat sebuah script dengan nama "tombol.css" lalu masukan scipt tersebut di dalam nya :

#TombolPosting a:link, #TombolPosting a:visited {
display: block;
color: black;
text-decoration: none;
padding: 8px 10px 4px 10px;
margin-right: 5px;

background-image: url(image/tombol1.png);
background-repeat: no-repeat;
width: 180px;
height: 40px;
text-indent: 60px;
}

#TombolPosting a:hover {
background-image: url(image/tombol2.png);
background-repeat: no-repeat;
color: white;
}
#TombolPosting ul {
margin: 0;
padding: 0;
list-style-type: none;
}

#TombolPosting li {
float: left;

}

.pemisah {
clear: both;
}

--> Dan ini untuk file HTML nya :

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Contoh Link

session_start();
if (isset($_SESSION["user_name"]))
{
echo
"
Daftar Posting";
echo "
";
echo
"
Mengisi Posting";
echo "
";
echo "
Menambah User";
echo '
';
echo
'LogOut';
}
else
{
echo
'Postingan Terbaru';
echo '
';
echo '
';
include("setformsearch.php");
include("setformlogin.php");
}
?>