CSS：使用图片作为 input 按钮背景图，把多张图片合成一张图片分别调用_

文章·资料	电脑软件	手机软件	网站源码
电脑·手机·网络学习话题娱乐故事文化·历史国学典籍法律法规	操作系统网络办公·文件音频视频图形图像硬件·驱动程序行业学习编程游戏	安卓苹果鸿蒙其他	ASP ASP.NET JSP PHP HTML·CSS·JavaScript

本站搜索

推荐文章 More...


	华硕易电脑(ASUS Eee PC 10.. 先来段开场白：为了外出携带方便，..

	Acronis True Image 使用.. 　　一款可以在Windows下使用全..

	Norton Ghost 使用详解一、分区备份　　使用Ghost进..

文章阅读排行


	Microsoft SQL Server 2000.. 　　对于第一次安装 Microsoft SQ..

	ASP：Dimac W3 JMail 发送.. 【发送邮件测试代码下载】压..

	ASP：Persits ASPMail 发送.. 【发送邮件测试代码下载】压..

	VMware Workstation：安装.. 编写这份虚拟机安装的图文教程，..

	华硕易电脑(ASUS Eee PC 10.. 先来段开场白：为了外出携带方便，..

	ASP：Microsoft CDO 发送邮.. 【发送邮件测试代码下载】压..

文章信息

CSS：使用图片作为 input 按钮背景图，把多张图片合成一张图片分别调用

〖评论()〗〖留言〗〖收藏〗

〖文章分类：电脑·手机·网络 / HTML·CSS·JavaScript〗〖阅读选项〗

使用图片作为 input 按钮背景图，把多张图片合成一张图片分别调用。

〖源码〗
--------------------------------------------------------
<input type="submit" id="" name="Button_Submit" value="" class="Style_Button_Submit"/>
<input type="reset" id="" name="Button_Reset" value="" class="Style_Button_Reset"/>
<input type="button" id="" name="Button_Add" value="" class="Style_Button_Add"/>
<input type="button" id="" name="Button_Back" value="" class="Style_Button_Back"/>

〖效果〗
--------------------------------------------------------

1、CSS 文件：

.Style_Button_Add {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll 0px 0px;cursor:pointer;}
.Style_Button_Back {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -64px 0px;cursor:pointer;}
.Style_Button_Backup {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -64px -24px;cursor:pointer;}
.Style_Button_Browse {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -64px -48px;cursor:pointer;}
.Style_Button_Cancel {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px 0px;cursor:pointer;}
.Style_Button_Cancellation {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -24px;cursor:pointer;}
.Style_Button_Compress {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -48px;cursor:pointer;}
.Style_Button_Confirm {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -72px;cursor:pointer;}
.Style_Button_Copy {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -96px;cursor:pointer;}
.Style_Button_Create {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -120px;cursor:pointer;}
.Style_Button_Cut {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -128px -144px;cursor:pointer;}
.Style_Button_Decompression {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -192px 0px;cursor:pointer;}
.Style_Button_Delete {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -192px -24px;cursor:pointer;}
.Style_Button_Disable {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -192px -48px;cursor:pointer;}
.Style_Button_Download {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -192px -72px;cursor:pointer;}
.Style_Button_Drawback {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -192px -96px;cursor:pointer;}
.Style_Button_Edit {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -256px 0px;cursor:pointer;}
.Style_Button_Empty {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -256px -24px;cursor:pointer;}
.Style_Button_Enabled {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -256px -48px;cursor:pointer;}
.Style_Button_Execute {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -256px -72px;cursor:pointer;}
.Style_Button_Exit {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -256px -96px;cursor:pointer;}
.Style_Button_Forward {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -320px 0px;cursor:pointer;}
.Style_Button_Goto {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -384px 0px;cursor:pointer;}
.Style_Button_Help {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -448px 0px;cursor:pointer;}
.Style_Button_Hidden {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -448px -24px;cursor:pointer;}
.Style_Button_HTML {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -448px -48px;cursor:pointer;}
.Style_Button_List {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -704px 0px;cursor:pointer;}
.Style_Button_Login {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -704px -24px;cursor:pointer;}
.Style_Button_Lookup {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -704px -48px;cursor:pointer;}
.Style_Button_Modify {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -768px 0px;cursor:pointer;}
.Style_Button_New {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -832px 0px;cursor:pointer;}
.Style_Button_Open {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -896px 0px;cursor:pointer;}
.Style_Button_Option {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -896px -24px;cursor:pointer;}
.Style_Button_Paste {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px 0px;cursor:pointer;}
.Style_Button_Play {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px -24px;cursor:pointer;}
.Style_Button_Preview {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px -48px;cursor:pointer;}
.Style_Button_Printing {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px -72px;cursor:pointer;}
.Style_Button_Publish {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px -96px;cursor:pointer;}
.Style_Button_Purview {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -960px -120px;cursor:pointer;}
.Style_Button_Read {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px 0px;cursor:pointer;}
.Style_Button_Recovery {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -24px;cursor:pointer;}
.Style_Button_Register {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -48px;cursor:pointer;}
.Style_Button_Reload {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -72px;cursor:pointer;}
.Style_Button_Rename {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -96px;cursor:pointer;}
.Style_Button_Replace {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -120px;cursor:pointer;}
.Style_Button_Reply {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -144px;cursor:pointer;}
.Style_Button_Reset {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -168px;cursor:pointer;}
.Style_Button_Run {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1088px -192px;cursor:pointer;}
.Style_Button_Save {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px 0px;cursor:pointer;}
.Style_Button_Search {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -24px;cursor:pointer;}
.Style_Button_Select_All {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -48px;cursor:pointer;}
.Style_Button_Select_Clear {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -72px;cursor:pointer;}
.Style_Button_Select_Reverse {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -96px;cursor:pointer;}
.Style_Button_Set {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -120px;cursor:pointer;}
.Style_Button_Statistics {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -144px;cursor:pointer;}
.Style_Button_Stop {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -168px;cursor:pointer;}
.Style_Button_Show {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -192px;cursor:pointer;}
.Style_Button_Submit {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1152px -216px;cursor:pointer;}
.Style_Button_Update {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1280px 0px;cursor:pointer;}
.Style_Button_Upgrade {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1280px -24px;cursor:pointer;}
.Style_Button_Upload {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1280px -48px;cursor:pointer;}
.Style_Button_Unread {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1280px -72px;cursor:pointer;}
.Style_Button_View {width:64px;height:24px;border:0px;background:transparent url('Buttons_64-24.png') no-repeat scroll -1344px 0px;cursor:pointer;}

2、图片按钮（共计60+个按钮）：

【打包下载】

文章作者：啊估整理更新日期：2021-07-01

〖文章浏览：〗〖打印文章〗〖发送文章〗

阅读说明

·本站大部分文章转载于网络，如有侵权请留言告知，本站即做删除处理。
·本站法律法规类文章转载自[中国政府网(www.org.cn)]，相关法律法规如有修订，请浏览[中国政府网]网站。
·本站转载的文章，不为其有效性，实效性，安全性，可用性等做保证。
·如果有什么问题，或者意见建议，请联系［网站管理员］。

当百网

本站使用【啊估文章软件站】网站系统〖网站管理员留言簿〗