终于暂时的结束了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 图标的更多相关文章

  1. .NET Core的响应式框架,基于Ace Admin框架菜单导航,Bootstrap布局,fontAwesome图标,内嵌Iframe用EasyUI做数据绑定,动态配置列表,动态配置表单

    netnrf 响应式框架 用于快速开发的响应式框架 演示:https://rf2.netnr.com v3.x 前端采用 jQuery + Bootstrap + EasyUI + AceAdmin ...

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

    直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:befor ...

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

    图标字体介绍 在介绍图标字体之前,不得不介绍图标格式ICON ICON是一种图标格式,我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅,我的电脑是一个显示器图标 ----- ...

  4. BootStrap glyphicons字体图标

    本章将讲解Bootstrap glyphicons字体图标,并通过一些实例了解它的使用,字体图标是在 Web 项目中使用的图标字体.字体图标在下载的Bootstrap的fonts文件夹中   本章将讲 ...

  5. [Qt] fontawesome图标

    fontawesome图标 fontawesome是一个图标的集合,里面有好多的图标,使用起来也还是非常方便的. 图标信息可以到官网去查:http://fontawesome.io/cheatshee ...

  6. 第八十四节,css布局小技巧及font-awesome图标使用

    css布局小技巧及font-awesome图标使用 图片鼠标放上去遮罩效果,显示文字 当鼠标放上去时 /*最外层div*/ .a{ width: 384px; height: 240px; backg ...

  7. 在 Windows Forms 和 WPF 应用中使用 FontAwesome 图标

    前言 FontAwesome 大家都不陌生,精美的图标,出现在各式各样的网页中. 最近在做 Windows Forms 应用程序,要求美观,就想能不能把 FontAwesome 图标用上,于是就有了本 ...

  8. FontAwesome 图标字体库的使用

    在前端开发中,许多新手常会遇见一个问题,参考的网页上有类似下图的图标,但在资源里却找不到对应的文件,这是因为这些网页使用了图标库.这里介绍一种常见的图标库——FontAwesome的使用. 1.登录F ...

  9. fontawesome图标字体库组件在服务器上显示不出来图标的解决

    这个组件在我所开发的网站中被大量使用,为网站增色不少.在本地测试的时候所有图标都能显示出来,可一到服务器上就显示不出来了.网上查列出了可能的原因.其一,IIS没有注册字体类型.经过检查,不存在这个问题 ...

随机推荐

  1. Nginx详解二十二:Nginx深度学习篇之Lua解释器安装及基础语法

    解释器 Lua:Lua是一个简洁.轻量.可扩展的脚本语言 Nginx+Lua优势充分的结合Nginx的并发处理epoll优势的Lua的轻量实现简单的功能切高并发的场景 安装Lua 1.安装解释器:yu ...

  2. selenium 操作键盘

    send_keys(Keys.ENTER) 按下回车键send_keys(Keys.TAB) 按下Tab制表键send_keys(Keys.SPACE) 按下空格键spacesend_keys(Kye ...

  3. JAVA 程序编译过程;编辑器,编译器和解释器

    最基本的软件工具包括,编辑器,编译器,解释器; 编译器:编译器就是将一种编程语言代码翻译成另一种语言的等效代码程序. 解释器:解释器将编译和执行交织在一起,即编译一部分代码后执行该部分代码,然后再编译 ...

  4. Python sendmail

    #coding:utf- #强制使用utf-8编码格式 import smtplib #加载smtplib模块 from email.mime.text import MIMEText from em ...

  5. C#递归拷贝文件删除文件

    拷贝文件及子文件,最后一个参数排除,哪个不要删除.(其实就是移动的效果) //拷贝文件及子文件 public static void CopyDirectory(string src, string ...

  6. UEditor黑白名单配置

    在网上找了很多,都不对.自己尝试,代码如下: 在new UEditor之前加上: Object.assign(window.UEDITOR_CONFIG.whitList, { filling: [' ...

  7. 令人疑惑的 std::remove 算法

    摘自<Effective STL>第32条 remove的声明: template<class ForwardIterator, class T> ForwardIterato ...

  8. lrzsz linix 远程文件传输工具。

    安装方法 #yum install lrzsz -y 使用方法 #rz -y 上传指定文档到当前目录

  9. MySQL常用引擎的锁机制

    一.引言                                                                                                 ...

  10. js 时间动画优化

    function moveDivTimeBasedImprove(div, fps) { var left = 0; var current = +new Date; var previous = + ...