Menu Horizontal Tanpa Edit HTML
Mau buat Menu Horizontal seperti gambar di samping ???,
Langsung aja ikuti cara di bawah ini...
login ke blog anda, terus Tata Letak lalu pilih Element Lama kemudian Tambah Gadget lalu pilih HTML/java script dan selanjutnya anda copy – paste kode dibawah ini...
.black{
float:left; margin-bottom:10px;
padding:0px; width: 100%;
overflow: hidden; background: #499bea;
background: -moz-linear-gradient(top, #999 0%, #000 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#999), color-stop(100%,#000));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#999', endColorstr='#000',GradientType=0 );
-moz-box-shadow: 1px 1px 10px #888;
-webkit-box-shadow:1px 1px 10px #888;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;}
.black ul{
margin: 0; padding: 0; padding-left: 10px;
font: bold 14px Verdana;
list-style-type: none; }
.black li{
display: inline; margin: 0;}
.black li a{
float: left; text-decoration: none;
margin: 0; padding:12px; color: white;}
.black li a:visited{color: white; }
.black li a:hover, .black li.selected a{color:#ccff00;}
#searchboxo{
width:250px; float:right; padding: 4px; margin:0px; }
#searchboxo form input.searchinput{
background: #fff; padding:6px; margin:0px; width: 160px;
border: solid 1px #999; outline: none;
-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
-moz-box-shadow: inset 0 1px 3px #666;
-webkit-box-shadow: inset 0 1px 3px #666;
box-shadow: inset 0 1px 3px #aaa; }
#searchboxo form input.submitbutton{
cursor:pointer; width: 60px;
background: #FCFCFC;
background: -moz-linear-gradient(top, #FCFCFC 0%, #E8E8E8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FCFCFC), color-stop(100%,#E8E8E8));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFCFC', endColorstr='#E8E8E8',GradientType=0 );
border:1px solid #d8d8d8;
-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;
color:#000; padding:4px; text-shadow:1px 1px #fff;}
</style>
<div class='black'>
<ul><li><a href=" #">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Galery</a></li>
</ul>
<div id='searchboxo'>
<form action='/search' id='searchform' method='get'> <input class='searchinput' id='searchbox' name='q' onblur='if (this.value == "") {this.value = "Insert keyword here...";}' onfocus='if (this.value == "Insert keyword here..."{this.value = "";}' type='text' value='insert keyword here...'/><input class='submitbutton' type='submit' value='search'/></form></div><
Catatan:
yang perlu Anda ganti hanya tulisan yang berwana biru.
Responses
0 Respones to "Menu Horizontal Tanpa Edit HTML"
Post a Comment
Terima kasih telah membaca dan berkomentar Menu Horizontal Tanpa Edit HTML, .