.icon-blank{
background:url('icons/blank.gif') no-repeat;
}
.icon-add{
background:url('icons/edit_add.png') no-repeat;
}
.icon-edit{
background:url('icons/pencil.png') no-repeat;
}
.icon-remove{
background:url('icons/edit_remove.png') no-repeat;
}
.icon-save{
background:url('icons/filesave.png') no-repeat;
}
.icon-cut{
background:url('icons/cut.png') no-repeat;
}
.icon-ok{
background:url('icons/ok.png') no-repeat;
}
.icon-no{
background:url('icons/no.png') no-repeat;
}
.icon-cancel{
background:url('icons/cancel.png') no-repeat;
}
.icon-reload{
background:url('icons/reload.png') no-repeat;
}
.icon-search{
background:url('icons/search.png') no-repeat;
}
.icon-print{
background:url('icons/print.png') no-repeat;
}
.icon-help{
background:url('icons/help.png') no-repeat;
}
.icon-undo{
background:url('icons/undo.png') no-repeat;
}
.icon-redo{
background:url('icons/redo.png') no-repeat;
}
.icon-back{
background:url('icons/back.png') no-repeat;
}
.icon-sum{
background:url('icons/sum.png') no-repeat;
}
.icon-tip{
background:url('icons/tip.png') no-repeat;
}
.icon-mini-add{
background:url('icons/mini_add.png') no-repeat 2px 2px;
}
.icon-mini-edit{
background:url('icons/mini_edit.png') no-repeat 2px 2px;
}
.icon-mini-refresh{
background:url('icons/mini_refresh.png') no-repeat 3px 2px;
}
1.3.0版easyui默认图标有这些,下载easyUI的压缩包后,解压后在theme文件夹下的icon文件夹是默认的图标,如果你觉得不够用,可以上网下载16x16大小的图片,放在icon文件夹下,然后更改theme文件夹下的icon.css
添加以下css代码即可
.icon-你的名称{
background:url('icons/图片名称.png') no-repeat 3px 2px;
网络借鉴
}
分享到:
相关推荐
"EasyUi icon扩展小图标.rar"就是一个专门为EasyUi设计的图标资源库,包含1700多个丰富的扩展小图标,极大地丰富了开发者在设计界面时的选择。 这个资源包提供的图标具有以下特点: 1. **多样性**:1700多个图标...
"EasyUI_Icon_图标扩展(1775个)" 是为了解决这个问题而创建的资源包。这个扩展包增加了1775个额外的图标,极大地丰富了可用的图标库,使得开发者能够选择更适合项目风格和功能需求的图标,提高应用的用户体验和...
这个名为“EasyUI_Icon_图标扩展样式(1775个)”的压缩包,显然提供了一个包含1775个图标的集合,旨在增强EasyUI项目的视觉效果。这些图标可能涵盖各种类别,如导航、编辑、状态、警告、设置等,为开发者在创建页面...
EasyUi是一款广泛应用于Web开发的轻量级JavaScript框架,它基于jQuery,提供了丰富的组件和精美的界面设计。在开发过程中,UI元素的美观性和用户体验往往直接影响到项目的质量和用户满意度。标题提到的“EasyUi图标...
这些图标可能包括通用的操作图标(如添加、删除、编辑、保存)、方向图标(如向上、向下、向左、向右)、状态图标(如成功、警告、错误)以及其他特定业务场景所需的图标。 使用这些图标非常简单,一旦解压并引入到...
1. **图标集成**:首先,将下载的 `EasyUI_Icon_Ext` 压缩包解压,并将其中的 CSS 文件和图片资源文件夹引入到你的项目中。通常,CSS 文件应链接到页面的 `<head>` 部分,而图片资源应放在服务器上的适当位置,确保 ...
例如,如果你想要在按钮上添加一个“保存”图标,你可以使用类似`.icon-save`这样的CSS类。这样做不仅简化了代码,还使得图标可以与文本很好地融合,提高了界面的可读性和美观度。 在提供的压缩包"icon"中,你将...
这里,`.easyui-icon`是EasyUI中用于图标的基本类,`icon-new`则是扩展库中定义的特定图标类。具体可用的图标类名可以在扩展库的文档中查找,或者通过查看CSS文件中的定义来了解。 在实际开发中,为了确保兼容性和...
3. **图片资源**:EasyUI 包含一些图标和其他图形资源,用于组件的显示。这些图片通常存储在 `images` 目录下,需要确保它们能被浏览器正确访问。 4. **示例和文档**:下载包可能还包含示例代码和用户手册,这对于...
在使用EasyUI框架进行Web应用开发时,DataGrid是一个非常重要的组件,用于展示结构化的数据。DataGrid提供了很多功能,包括分页、过滤、排序等。然而,标题中提到的"easyui datagrid排序图标"是DataGrid的一个关键...
这些图标可以被CSS引用,通过背景图片的方式展示出来。开发者可以根据需要调整图标的大小、颜色,甚至进行动画效果的添加,以满足不同场景的需求。 在实际应用中,为了使用这些扩展图标,首先需要将IconExtension....
<button class="easyui-button" iconCls="easyui-icon-new">新建 ``` 在这里,`iconCls`属性指定了图标类,使得按钮显示新图标。为了使图标与文字对齐,可能还需要调整组件的`padding`属性。 此外,如果使用了LESS...
EasyUI Icons是一个流行的前端开发框架EasyUI的一部分,它提供了一系列美观、实用的图标资源,用于增强用户界面的视觉效果和用户体验。在Web开发中,图标是界面设计的关键元素,能够直观地传达信息,提高用户的交互...
`iconCls` 是EasyUI中用于指定图标类名的属性,它将添加一个特定的CSS类到元素上,该类定义了显示的图标样式。例如,如果你找到了一个适合的图标,其类名为 "icon-save",那么你可以在按钮或者其他需要展示图标的...
在实际应用中,还要考虑性能和可扩展性,比如是否需要懒加载图片,如何处理大量数据时的内存占用,以及如何适应不同的屏幕尺寸和设备。图标的选择也应遵循一致性原则,确保用户能快速识别其含义。 总之,“DataGrid...
这个压缩包文件包含了"EasyUi图标扩展样式"的所有资源,可能包括CSS样式文件、SVG或者PNG格式的图标图片,以及可能的示例HTML文件。在使用这些扩展样式时,开发者需要将对应的CSS文件引入到项目中,并根据需要在HTML...
为了方便使用,压缩包中的"EasyUi图标扩展样式"很可能包含了图标图片文件(如PNG或SVG格式)以及对应的CSS文件,开发者只需要将这些文件引入到项目中,就可以立即享受到丰富的图标资源。同时,根据项目的需求,...
【快速学习easyUI】 easyUI 是一个基于 jQuery 的前端框架,用于快速开发界面美观、功能丰富的Web应用。它提供了一系列预定义的CSS样式和JavaScript组件,使得开发者能够轻松创建响应式且用户友好的界面,与ext-js...
- **优化图片资源**:压缩图片大小,使用恰当的图片格式,如 SVG 代替部分 PNG 或 JPEG 图片。 通过这些优化方案,虽然无法完全达到现代浏览器的渲染效率,但可以在很大程度上提升 IE8 及以下版本中 EasyUI 应用的...