终于暂时的结束了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. SpringBoot图片上传(一)

    简单描述:点击上传文件的图标,上传文件,上传成功后,图标编程上传的图片. 吐槽:文件上传下载这种东西,总是感觉莫名的虚-_-||  也不知道是造了什么孽,(其实就是IO File这一块的知识了解的不太 ...

  2. java常用的中间件

    tomcatWeblogicJBOSSColdfusionWebsphereGlassFish 一般本地开发的话建议使用tomcat. linux系统建议使用jetty或apache hpptd 大型 ...

  3. 区分TCP包的顺序

    确认TCP包的顺序: 使用抓包工具抓包之后,通常按照时间先后排序的,而不是数据的内容逻辑先后.查找内容的先后的关键在于查看TCP中的Sequence number和Acknowledgment num ...

  4. ZOJ 4057 XOR Clique(位运算)

    XOR Clique BaoBao has a sequence a​1​,a​2,...,a​n. He would like to find a subset S of {1,2,...,n} s ...

  5. NodeJs——router报错原因

    rout.js var http = require('http'); var url = require('url'); var router = require('./models/router. ...

  6. C#Enum用Tuple保存值绑定到前端的CheckBox

    //把数字转成枚举 public static T[] NumStringsToEnums<T>(string enumNumString ) //where T:Enum { if (s ...

  7. json2csharp & json 格式化

    json2csharp: http://json2csharp.com/ bejson: http://www.bejson.com/

  8. order by 导出数据不一致的问题

    转自 http://blog.csdn.net/wwwwei_csdn/article/details/78181197 前言   数据库分页是后台经常要使用的技术手段,有时候进行数据库查询会根据业务 ...

  9. [转]教你十分钟下载并破解IntelliJ IDEA(2017)

    来源:http://www.itwendao.com/article/detail/400687.html 温馨提示:IntelliJ IDEA(2017)需要安装JDK8以上才能运行 如果你是JDK ...

  10. .Net core2.0+Mysql5.7部署到CentOS7.5完整实践经验

    本文为本人最近学习将.Net Core部署到Linux的一些经验总结,也提供点也和我一样对Linux接触不多的.Net Core开发者. 一.部署用到的环境和工具 1.Linux采用最新的CentOS ...