Step2 - HTML/CSS
按钮的HTML代码很简单:
<a class=”button”>前端档案</a>
再通过CSS设置一下背景图片就可以了,CSS代码如下:
/*链接按钮样式*/ .button { width:200px; height:80px; display:block; background:url(bg_button.gif) top no-repeat; text-indent:-9999px; } /*按钮悬停样式*/ .button:hover{ background:url(bg_button.gif) bottom no-repeat; }
按照我们前面设计的图片,按钮的长宽为200px X 80px,背景图为黑色按钮。这段CSS就能够实现我们示例中的第一种效果(纯CSS效果)。
出处:蓝色理想
责任编辑:moby
上一页 jQuery打造动态渐变按钮 [4] 下一页 jQuery打造动态渐变按钮 [6]
◎进入论坛网页制作、WEB标准化版块参加讨论,我还想发表评论。
|