DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> CSS制作3D風格的網頁按鈕特效代碼
CSS制作3D風格的網頁按鈕特效代碼
編輯:CSS詳解     

<Html>
<body>
<style type="text/CSS">

#elButton a  {

 color: #000000;

 font-size:10px;

 font-family:verdana;

 font-weight:bold;

 text-decoration: none;

 border:4px outset aqua;

 background-color:#00ffff;

 display: block;

 width: 160px;

 padding: 3px 5px;

 margin: 1px;

}

#elButton a:hover {

 background-color: #00c0c0;

 color:#000000;

 padding-left:4px;

 border:4px inset aqua;

}

#elButton a  {

 color: #000;

 font-size:10px;

 font-family:verdana;

 font-weight:bold;

 text-decoration: none;

 border:4px outset aqua;

 background-color:#00ffff;

 display: block;

 width: 160px;

 padding: 3px 5px;

 margin: 1px;

}

#elButton a:hover {

 background: #00c0c0;

 color:#000000;

 padding-left:4px;

 border:4px inset aqua;

}

</style>
</head>
<body>

<div id="elButton">

   <div>

      <a href="#">Java Script</a>

   </div>

   <div>

      <a href="#">Dynamic Html</a>

   </div>

   <div>

      <a href="#">Server Side</a>

   </div>

   <div>

      <a href="#">ClIEnt Side</a>

   </div>

</div>
</body>
</Html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved