加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

dojo按钮处理方式

发布时间:2020-12-16 21:32:53 所属栏目:百科 来源:网络整理
导读:1.dojo中大部分按钮都先分组,同类图片放入同一张图片.因为一张图片的加载速度肯定会快(请求次数减少.) style type="text/css".editorIconCut{ background-image: url("editorIconsEnabled.png");background-repeat: no-repeat; width: 18px; height: 18px; t

1.dojo中大部分按钮都先分组,同类图片放入同一张图片.因为一张图片的加载速度肯定会快(请求次数减少.)

<style type="text/css">
.editorIconCut{ 
	background-image: url("editorIconsEnabled.png");
	background-repeat: no-repeat; 
	width: 18px; 
	height: 18px; 
	text-align: center; 
	background-position: -54px;
}
</style>
<button id="btn1" class="editorIconCut"></button>


2.再深入一点点.如果引入其他图片,那不是每个class都要重新再写一次吗?一般框架中,都会定义两个class.这样可以简单的定义多个图标了.

<style type="text/css">.editorIcon{
	background-image: url("editorIconsEnabled.png");
	background-repeat: no-repeat;
         width: 18px;
         height: 18px;
         text-align: center;
         
         }
.editorIconCut{ background-position: -54px;}
.editorIconCopy { background-position: -72px; }
</style>
<button id="btn2" class="editorIcon editorIconCopy"></button>
<button id="btn1" class="editorIcon editorIconCut"></button>

3.如果还有一张其他分组内同样款的图片,如一张点击过后的图标图片(灰色)

那只要在此定义个class

.editorIconDisabled{background-image: url("editorIconsDisabled.png");background-repeat: no-repeat; width: 18px; height: 18px; text-align: center;}

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读