BootStrap中的Fontawesome 图标


Posted in Javascript onMay 25, 2017

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

BootStrap中的Fontawesome 图标

第一个,显示时间选择的控件。我在网上也搜了好多相关组件,但是可能跟我之前引入的js和css有冲突,所以出来的格式一直不对。后来就重新建了一个页面,专门显示datetimepicker,这次很容易就出来了。

@section CSS{
 <link href="~/Content/admin/css/bootstrap-datetimepicker.min.css" rel="external nofollow" rel="stylesheet" />
 <link href="~/Content/admin/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet" />//需要引入的css,不过这里还缺一个,后面会提到。
}
<input size="16" type="text" id="datetimeStart" readonly class="form_datetime">
--
<input size="16" 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>

控件显示到页面上之后,我就发现不对劲,因为没有左右的箭头,BootStrap中的Fontawesome 图标又捣鼓了一阵,最后找到了对应的css文件BootStrap中的Fontawesome 图标,随后百度了这个的意思,才知道用的是fontawesome图标
BootStrap中的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="external nofollow" rel="stylesheet" />//上面说的少个就是这个

以上所述是小编给大家介绍的BootStrap中的Fontawesome 图标,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JQuery跨Iframe选择实现代码
Aug 19 Javascript
js修改原型的属性使用介绍
Jan 26 Javascript
jQuery前端框架easyui使用Dialog时bug处理
Dec 05 Javascript
怎么通过onclick事件获取js函数返回值(代码少)
Jul 28 Javascript
jQuery基本选择器(实例及表单域value的获取方法)
May 20 Javascript
jQuery增加、删除及修改select option的方法
Aug 19 Javascript
Vue 单文件中的数据传递示例
Mar 21 Javascript
JavaScript ES2019中的8个新特性详解
Feb 20 Javascript
Vue.js中该如何自己维护路由跳转记录
May 19 Javascript
react+redux仿微信聊天界面
Jun 21 Javascript
深入webpack打包原理及loader和plugin的实现
May 06 Javascript
vue+canvas实现移动端手写签名
May 21 Javascript
Vue.js 中的 $watch使用方法
May 25 #Javascript
详解Javascript获取缓存和清除缓存API
May 25 #Javascript
Angularjs 实现动态添加控件功能
May 25 #Javascript
JavaScript实现自动跳转文本功能
May 25 #Javascript
angularjs项目的页面跳转如何实现(5种方法)
May 25 #Javascript
AngularJS基于factory创建自定义服务的方法详解
May 25 #Javascript
AngularJS读取JSON及XML文件的方法示例
May 25 #Javascript
You might like
用PHP 4.2书写安全的脚本
2006/10/09 PHP
PHP提交表单失败后如何保留已经填写的信息
2014/06/20 PHP
thinkPHP5.0框架独立配置与动态配置方法
2017/03/17 PHP
PHP+ajax实现获取新闻数据简单示例
2018/05/08 PHP
url地址自动加#号问题说明
2010/08/21 Javascript
JQuery live函数
2010/12/24 Javascript
jQuery操作checkbox选择(list/table)
2013/04/07 Javascript
JS子父窗口互相操作取值赋值的方法介绍
2013/05/11 Javascript
微信小程序  wx.request合法域名配置详解
2016/11/23 Javascript
vue打包后显示空白正确处理方法
2017/11/01 Javascript
JS中使用textPath实现线条上的文字
2017/12/25 Javascript
解决vue 项目引入字体图标报错、不显示等问题
2018/09/01 Javascript
webpack4 升级迁移的实现
2018/09/12 Javascript
微信小程序实现简单评论功能
2018/11/28 Javascript
js实现图片上传到服务器和回显
2020/01/19 Javascript
JS localStorage存储对象,sessionStorage存储数组对象操作示例
2020/02/15 Javascript
Python随机生成彩票号码的方法
2015/03/05 Python
python根据京东商品url获取产品价格
2015/08/09 Python
python编程之requests在网络请求中添加cookies参数方法详解
2017/10/25 Python
python之从文件读取数据到list的实例讲解
2018/04/19 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
django restframework serializer 增加自定义字段操作
2020/07/15 Python
CSS中垂直居中的简单实现方法
2015/07/06 HTML / CSS
Html5 实现微信分享及自定义内容的流程
2019/08/20 HTML / CSS
介绍一下JNDI的基本概念
2013/07/26 面试题
综合素质的自我鉴定
2013/10/07 职场文书
环境工程专业个人求职信
2013/12/05 职场文书
珍珠鸟教学反思
2014/02/01 职场文书
民生工程实施方案
2014/03/22 职场文书
学校党委副书记个人对照检查材料思想汇报
2014/09/28 职场文书
语文复习计划
2015/01/19 职场文书
高中诗歌鉴赏教学反思
2016/02/16 职场文书
nginx反向代理时如何保持长连接
2021/03/31 Servers
利用ajax+php实现商品价格计算
2021/03/31 PHP
从np.random.normal()到正态分布的拟合操作
2021/06/02 Python
设置IIS Express并发数
2022/07/07 Servers