Print this pageKode yang digunakan adalah :
<html>
<head>
<style type="text/css">
#menu {padding:0; margin:0; list-style:none; width:100%; height:400px; position:absolute; top:5px; left:0px;}
#menu li {position:relative; float:left;}
#menu li a {display:block; height:45px; width:100px; padding:0; float:left; color:#fff; text-decoration:none; font-family:"trebuchet MS", sans-serif; font-size:14px; text-align:center; cursor:pointer; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rbVMZN9ARcQvVUYLRJlpeDaLn40bNxjjamDiIZqWdCNYTEUqUS8SwyOpG-UzX2OxDYhnO8cd55filkVtzcSlUPwBD7rJ0sS5CXeKQVQhVJ46t3tYrzufMOfRnoWFORA3pj-Urz36pUSM/w100-h45-no/button-off.png);}
#menu li a b {position:relative; top:12px; font-weight:normal;}
* html #menu li a {background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rbVMZN9ARcQvVUYLRJlpeDaLn40bNxjjamDiIZqWdCNYTEUqUS8SwyOpG-UzX2OxDYhnO8cd55filkVtzcSlUPwBD7rJ0sS5CXeKQVQhVJ46t3tYrzufMOfRnoWFORA3pj-Urz36pUSM/w100-h45-no/button-off.png', sizingMethod='scale');}
#menu li a:hover,
#menu li a:active,
#menu li a:focus,
.home #menu li#home a,
.single #menu li#single a,
.dropdown #menu li#dropdown a,
.dropline #menu li#dropline a,
.flyout #menu li#flyout a,
.support #menu li#support a,
.contact #menu li#contact a
{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZl8t6rcAPW9w9cfDhyphenhyphenwAKPQS7CJWVRqYylhJ_l-7RBGUPVfzbFKcSTj1P3Gn3V5W5z0zjmX_CeKIcnivS7CLyfpJOUMuCudIOSycR36ASzQbZBHTpkm_VYOuG7o5ihIL6r5i1rlG9VQCp/w100-h45-no/button-on.png) no-repeat right top; cursor:pointer; color:#fff;}
* html #menu li a:hover,
* html #menu li a:active,
* html #menu li a:focus,
* html .home #menu li#home a,
* html .single #menu li#single a,
* html .dropdown #menu li#dropdown a,
* html .dropline #menu li#dropline a,
* html .flyout #menu li#flyout a,
* html .support #menu li#support a,
* html .contact #menu li#contact a
{background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZl8t6rcAPW9w9cfDhyphenhyphenwAKPQS7CJWVRqYylhJ_l-7RBGUPVfzbFKcSTj1P3Gn3V5W5z0zjmX_CeKIcnivS7CLyfpJOUMuCudIOSycR36ASzQbZBHTpkm_VYOuG7o5ihIL6r5i1rlG9VQCp/w100-h45-no/button-on.png', sizingMethod='scale');}
#menu li a:hover b,
#menu li a:active b,
#menu li a:focus b,
.home #menu li#home a b,
.single #menu li#single a b,
.dropdown #menu li#dropdown a b,
.dropline #menu li#dropline a b,
.flyout #menu li#flyout a b,
.support #menu li#support a b,
.contact #menu li#contact a b
{cursor:pointer; top:8px; padding-right:3px;}
</style>
</head>
<body>
<ul id="menu">
<li id="home" class="first"><a href="index.html"><b>Home</b></a></li>
<li id="single"><a href="single.html"><b>Single Level</b></a></li>
<li id="dropdown"><a href="dropdown.html"><b>Dropdown</b></a></li>
<li id="dropline"><a href="dropline.html"><b>Dropline</b></a></li>
<li id="flyout"><a href="flyout.html"><b>Flyout</b></a></li>
<li id="support"><a href="support.html"><b>Support</b></a></li>
</ul>
</body>
</html>
<head>
<style type="text/css">
#menu {padding:0; margin:0; list-style:none; width:100%; height:400px; position:absolute; top:5px; left:0px;}
#menu li {position:relative; float:left;}
#menu li a {display:block; height:45px; width:100px; padding:0; float:left; color:#fff; text-decoration:none; font-family:"trebuchet MS", sans-serif; font-size:14px; text-align:center; cursor:pointer; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rbVMZN9ARcQvVUYLRJlpeDaLn40bNxjjamDiIZqWdCNYTEUqUS8SwyOpG-UzX2OxDYhnO8cd55filkVtzcSlUPwBD7rJ0sS5CXeKQVQhVJ46t3tYrzufMOfRnoWFORA3pj-Urz36pUSM/w100-h45-no/button-off.png);}
#menu li a b {position:relative; top:12px; font-weight:normal;}
* html #menu li a {background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2rbVMZN9ARcQvVUYLRJlpeDaLn40bNxjjamDiIZqWdCNYTEUqUS8SwyOpG-UzX2OxDYhnO8cd55filkVtzcSlUPwBD7rJ0sS5CXeKQVQhVJ46t3tYrzufMOfRnoWFORA3pj-Urz36pUSM/w100-h45-no/button-off.png', sizingMethod='scale');}
#menu li a:hover,
#menu li a:active,
#menu li a:focus,
.home #menu li#home a,
.single #menu li#single a,
.dropdown #menu li#dropdown a,
.dropline #menu li#dropline a,
.flyout #menu li#flyout a,
.support #menu li#support a,
.contact #menu li#contact a
{background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZl8t6rcAPW9w9cfDhyphenhyphenwAKPQS7CJWVRqYylhJ_l-7RBGUPVfzbFKcSTj1P3Gn3V5W5z0zjmX_CeKIcnivS7CLyfpJOUMuCudIOSycR36ASzQbZBHTpkm_VYOuG7o5ihIL6r5i1rlG9VQCp/w100-h45-no/button-on.png) no-repeat right top; cursor:pointer; color:#fff;}
* html #menu li a:hover,
* html #menu li a:active,
* html #menu li a:focus,
* html .home #menu li#home a,
* html .single #menu li#single a,
* html .dropdown #menu li#dropdown a,
* html .dropline #menu li#dropline a,
* html .flyout #menu li#flyout a,
* html .support #menu li#support a,
* html .contact #menu li#contact a
{background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZl8t6rcAPW9w9cfDhyphenhyphenwAKPQS7CJWVRqYylhJ_l-7RBGUPVfzbFKcSTj1P3Gn3V5W5z0zjmX_CeKIcnivS7CLyfpJOUMuCudIOSycR36ASzQbZBHTpkm_VYOuG7o5ihIL6r5i1rlG9VQCp/w100-h45-no/button-on.png', sizingMethod='scale');}
#menu li a:hover b,
#menu li a:active b,
#menu li a:focus b,
.home #menu li#home a b,
.single #menu li#single a b,
.dropdown #menu li#dropdown a b,
.dropline #menu li#dropline a b,
.flyout #menu li#flyout a b,
.support #menu li#support a b,
.contact #menu li#contact a b
{cursor:pointer; top:8px; padding-right:3px;}
</style>
</head>
<body>
<ul id="menu">
<li id="home" class="first"><a href="index.html"><b>Home</b></a></li>
<li id="single"><a href="single.html"><b>Single Level</b></a></li>
<li id="dropdown"><a href="dropdown.html"><b>Dropdown</b></a></li>
<li id="dropline"><a href="dropline.html"><b>Dropline</b></a></li>
<li id="flyout"><a href="flyout.html"><b>Flyout</b></a></li>
<li id="support"><a href="support.html"><b>Support</b></a></li>
</ul>
</body>
</html>
0 komentar:
Posting Komentar