FontAwesome图标选择器

虽然比较简单,但很实用,在C# MVC下开发,请首先将图标名称保存到数据库中,图标窗口如下。

@{
	Layout = "~/Views/Shared/_Form.cshtml";
	var fontawesomelist = ViewData["fontAwesomeList"] as List<Mes.Domain._03_Entity.SystemManage.FontAwesomeEntity>;
}

<!DOCTYPE html>
<script type="text/javascript">
	function btn_edit(v1) {
		var v = $(v1).find("i").attr("class");
		var index = parent.layer.getFrameIndex(window.name);
		parent.$(‘#F_Icon‘).val(v);
		parent.layer.close(index);
	}
</script>
<html>
<body>
<div>
 @{
	foreach (var item in fontawesomelist)
	{

	<a class="btn" onclick="btn_edit(this)" style="width:30px"><i class="fa @item.F_FullName" ></i></a>
					 
	}
}
</div>
</body>
</html>
时间: 2024-08-26 14:58:50

FontAwesome图标选择器的相关文章

直接在 CSS 中引用 FONTAWESOME 图标(附码表)

直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:before { content: '\f006'; font-family: FontAwesome; } 同时附上图标类对应的字符编码表: NAME CODE NAME CODE .fa-glass \f000 .fa-github-alt \f113 .fa-music \f001 .fa-folder

学习WPF——使用Font-Awesome图标字体

图标字体介绍 在介绍图标字体之前,不得不介绍图标格式ICON ICON是一种图标格式,我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅,我的电脑是一个显示器图标 ---------------- 一个图标文件是扩展名为.ICO或者ICON的文件 直到现在图标文件还是在计算机程序中随处可见 但有时候需要在不失真的情况下放大图标 因为ICON本身与JPEG\PNG格式的图形文件差异不大,也是非矢量图形 所以图标文件就很难满足这种需求 ---------------- 为了

CSS 让 fontawesome 图标字体变细

一句 CSS 让 fontawesome 图标字体变细 自从 iOS 某个版本发布之后,前端的流行趋势是什么都越来越细-字体越来越细-图标线条也越来越细.而老物 fontawesome 粗壮的线条风格很显然已经跟不上流行的趋势了,不过在现代的浏览器里,倒是有办法让 fontawesome 改头换面,重获青春. 2018-04-12 补充:好久没有访问 fontawesome 的官网,现在居然也出 solid / regular / light(可能就是你们想要的细版)三种版本了!如果你放在访问了

font-awesome图标用法

font-awesome 没用过的可以百度一下,这个网站提供了海量的文字图标,用这个图标的好处一是整套的上千种图标,基本涵盖的所有的需要,二是使用起来非常简单,三不需要引入图片. 具体用法: 首先从官网下载文件zip包,解压后是这样的: 把fonts文件夹放在css文件夹相同目录下(注意一定要引入fonts文件夹!),同时页面引入font-awesome.min.css 然后使用<i class="fa fa-camera-retro"></i> 类似这样的就可

easyui combo+pagination 图标选择器

从数据库读取分页显示 $(function () { initTable(1, 180); $('#cc').combo({ editable: false, panelWidth: 'auto', panelHeight: 'auto' }); $('#iconSelectPanel').appendTo($('#cc').combo('panel')); $('#iconList').delegate('span', 'click', function () { var value = $(

!!图标(iconfont、fontawesome 等)

http://www.iconfont.cn/  阿里巴巴矢量图标库 iconfont http://fontawesome.io fontawesome图标 http://www.bootcss.com/p/font-awesome/#icons-new  2015-10-27 一.iconfont 图标库的使用: 第一步引入,第二步定义iconfont样式: /*第一步:使用font-face声明字体*/ @font-face {font-family: 'iconfont'; src: u

强大而灵活的字体图标替代库iconfont

   前言概述 在开发网页制作过程中通常需要一些网页小图标,前端需要PS切图,将单个小图标icon组合成CSS雪碧图过程中,需要一些时间和精力; 如果网页制作中需要的小图标icon有一套css框架库集成起来将大大提高开发效率于是就有了接下来要说的字体图标库fontAwesome.iconfont    fontAwesome 图标字体库与CSS框架 fontAwesome 官网http://fontawesome.dashgame.com目前Font Awesome最新版本version是4.7

WPF自定义控件与样式(1)-矢量字体图标(iconfont)

一.图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般外置字体一样的使用,因此Winform.WPF中都是可以用的. 在我们多个WPF项目中广泛使用了图标字体,包括自定义控件.自定义样式.模板等.总结下: 网上开源字体图标很多,很容易获取,项目开发中需要的绝大部分图标都可以找到,非常方便,推荐 阿里巴巴开源字体: 字体文件非常小,比使用png等图片文件

font-awesome与easyui结合

备忘记录 最近想重拾起来,做个ERP系统,做为一个前端盲,前端框架的选择是最头痛的问题 当前***bootstrap***与***font-awesome***的组合无疑是非常有吸引力的,从网上下了N多的后台框架模板,断断续续调试了1个月,最终弄出来的总是感觉不伦不类,无奈还是放弃 于是又想起了easyui,看到官网更新到1.4了,还有bootstrap主题,ok还是用它吧. 搭建框架时,看到easyui图标还是用的png的,那么考虑能不能直接使用font-awesome图标,不使用自身的呢?