bootstrap之FONTAWESOME 图标
终于暂时的结束了winform迎来了B/S的项目,这个需要我们自己写前端页面,要用bootstrap搭页面,本人小白,正在慢慢摸索中,主要记录遇到的问题,及解决办法。

第一个,显示时间选择的控件。我在网上也搜了好多相关组件,但是可能跟我之前引入的js和css有冲突,所以出来的格式一直不对。后来就重新建了一个页面,专门显示datetimepicker,这次很容易就出来了。
@section CSS{
<link href="~/Content/admin/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<link href="~/Content/admin/css/bootstrap.min.css" rel="stylesheet" />//需要引入的css,不过这里还缺一个,后面会提到。
}
<input size="" type="text" id="datetimeStart" readonly class="form_datetime">
--
<input size="" type="text" id="datetimeEnd" readonly class="form_datetime">
@section Scripts{
<script src="~/Content/admin/js/jquery.min.js"></script>
<script src="~/Content/admin/js/bootstrap.min.js"></script>
<script src="~/Content/bootstrap-datetimepicker.min.js"></script>
<script src="~/Content/bootstrap-datetimepicker.zh-CN.js"></script>//需要引入的js文件
}
<script type="text/javascript">
$(function () {
$('#datetimeStart').datetimepicker({
format: 'yyyy-mm-dd',
minView: 'month',
language: 'zh-CN',
autoclose: true,
}).on('click', function () {
$('#datetimeStart').datetimepicker("setEndDate", $("#datetimeEnd").val())
});
$("#datetimeEnd").datetimepicker({
format: 'yyyy-mm-dd',
minView: 'month',
language: 'zh-CN',
autoclose: true,
}).on("click", function () {
$("#datetimeEnd").datetimepicker("setStartDate", $("#datetimeStart".val()))
});
}); //设置datetimepicker的一些初始属性,参考链接:http://www.cnblogs.com/yttsic/p/3492834.html
</script>
控件显示到页面上之后,我就发现不对劲,因为没有左右的箭头
,又捣鼓了一阵,最后找到了对应的css文件
,随后百度了这个的意思,才知道用的是fontawesome图标
,而不是Glyphicon字体图标。(附参考链接:https://www.huangwenchao.com.cn/2014/12/font-awesome-css.html),最后恍然大明白,原来我没有加fontawesome图标的css文件
<link href="~/Content/admin/font-awesome/css/font-awesome.css" rel="stylesheet" />//上面说的少个就是这个
加上之后就圆满了,(*^__^*) 嘻嘻……
bootstrap之FONTAWESOME 图标的更多相关文章
- .NET Core的响应式框架,基于Ace Admin框架菜单导航,Bootstrap布局,fontAwesome图标,内嵌Iframe用EasyUI做数据绑定,动态配置列表,动态配置表单
netnrf 响应式框架 用于快速开发的响应式框架 演示:https://rf2.netnr.com v3.x 前端采用 jQuery + Bootstrap + EasyUI + AceAdmin ...
- 直接在 CSS 中引用 FONTAWESOME 图标(附码表)
直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:befor ...
- 学习WPF——使用Font-Awesome图标字体
图标字体介绍 在介绍图标字体之前,不得不介绍图标格式ICON ICON是一种图标格式,我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅,我的电脑是一个显示器图标 ----- ...
- BootStrap glyphicons字体图标
本章将讲解Bootstrap glyphicons字体图标,并通过一些实例了解它的使用,字体图标是在 Web 项目中使用的图标字体.字体图标在下载的Bootstrap的fonts文件夹中 本章将讲 ...
- [Qt] fontawesome图标
fontawesome图标 fontawesome是一个图标的集合,里面有好多的图标,使用起来也还是非常方便的. 图标信息可以到官网去查:http://fontawesome.io/cheatshee ...
- 第八十四节,css布局小技巧及font-awesome图标使用
css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...
- 在 Windows Forms 和 WPF 应用中使用 FontAwesome 图标
前言 FontAwesome 大家都不陌生,精美的图标,出现在各式各样的网页中. 最近在做 Windows Forms 应用程序,要求美观,就想能不能把 FontAwesome 图标用上,于是就有了本 ...
- FontAwesome 图标字体库的使用
在前端开发中,许多新手常会遇见一个问题,参考的网页上有类似下图的图标,但在资源里却找不到对应的文件,这是因为这些网页使用了图标库.这里介绍一种常见的图标库——FontAwesome的使用. 1.登录F ...
- fontawesome图标字体库组件在服务器上显示不出来图标的解决
这个组件在我所开发的网站中被大量使用,为网站增色不少.在本地测试的时候所有图标都能显示出来,可一到服务器上就显示不出来了.网上查列出了可能的原因.其一,IIS没有注册字体类型.经过检查,不存在这个问题 ...
随机推荐
- Penetration testing _internal & wireless Penetration Testing
第一部分 渗透测试步骤 ---参考资料 Ethical Hacking: The Value of Controlled Penetration Tests 下载地址 链接:https://pa ...
- Django标签&迭代&循环&过滤
1.{% for Person in persons %}模板标签的替换,就是利用了基础模板的底层设计,嵌套了其他显示的内容.常见的内容替换标签{% block content %}{%endbloc ...
- django----基于Form组件实现的增删改和基于ModelForm实现的增删改
一.ModelForm的介绍 ModelForm a. class Meta: model, # 对应Model的 fields=None, # 字段 exclude=None, # 排除字段 lab ...
- re模块(正则)
一, 什么是正则? 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法. 在python中,正则内嵌在python中,并通过re模块实现,正则表达模式被编译成一系列 ...
- 模块(import语句,from...import语句,_name_属性)
1, 什么是模块? 模块就是一系列功能的集合体 模块分为四个通用的类别: 1), 使用python编写的.py文件(*****) 2), 已被编译为共享库或DLL的C或C++扩展 3), 把一系列模块 ...
- jQuery---过滤选择器
4.过滤选择器 过滤选择器主要是通过特定的过滤规则来筛选出所需的DOM元素,过滤规则与CSS 中的伪类选择器语法相同,即选择器都以一个冒号(:)开头.按照不同的过滤规则, 过滤选择器可以分为基本过滤. ...
- linux+jenkins+jmeter+ant持续集成
0.安装jdk 1.下载jdk8 登录网址:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151 ...
- inline namespace
无意中看到C++11中的新特性inline namespace, 先附上官方的解释 Inline namespace The inline namespace mechanism is intende ...
- jenkins上节点显示swap空间不足解决方案
查看内存占用情况:free -m 1.swap分区原理: swap分区在系统的物理内存不够用的时候,把物理内存中的一部分空间释放出来,以供当前运行的程序使用.那些被释放的空间可能来自一些很长时 ...
- Just Oj 2017C语言程序设计竞赛高级组D: 字符串最大表示(next数组)
D: 字符串最大表示 时间限制: 1 s 内存限制: 128 MB 题目描述 有如下定义,abcnabcn表示字符串abc重复n次,例如abc2abc2表示abcabc. 给定一个字符串,求 ...