BootStrap中的Fontawesome 圖標(biāo)
終于暫時(shí)的結(jié)束了winform迎來(lái)了B/S的項(xiàng)目,這個(gè)需要我們自己寫(xiě)前端頁(yè)面,要用bootstrap搭頁(yè)面,本人小白,正在慢慢摸索中,主要記錄遇到的問(wèn)題,及解決辦法。
第一個(gè),顯示時(shí)間選擇的控件。我在網(wǎng)上也搜了好多相關(guān)組件,但是可能跟我之前引入的js和css有沖突,所以出來(lái)的格式一直不對(duì)。后來(lái)就重新建了一個(gè)頁(yè)面,專(zhuān)門(mén)顯示datetimepicker,這次很容易就出來(lái)了。
@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,不過(guò)這里還缺一個(gè),后面會(huì)提到。 } <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())) }); }); //設(shè)置datetimepicker的一些初始屬性,參考鏈接:http://www.cnblogs.com/yttsic/p/3492834.html </script>
控件顯示到頁(yè)面上之后,我就發(fā)現(xiàn)不對(duì)勁,因?yàn)闆](méi)有左右的箭頭,又搗鼓了一陣,最后找到了對(duì)應(yīng)的css文件
,隨后百度了這個(gè)的意思,才知道用的是fontawesome圖標(biāo)
,而不是Glyphicon字體圖標(biāo)。(附參考鏈接:https://www.huangwenchao.com.cn/2014/12/font-awesome-css.html),最后恍然大明白,原來(lái)我沒(méi)有加fontawesome圖標(biāo)的css文件
<link href="~/Content/admin/font-awesome/css/font-awesome.css" rel="external nofollow" rel="stylesheet" />//上面說(shuō)的少個(gè)就是這個(gè)
以上所述是小編給大家介紹的BootStrap中的Fontawesome 圖標(biāo),希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
ES6知識(shí)點(diǎn)整理之?dāng)?shù)組解構(gòu)和字符串解構(gòu)的應(yīng)用示例
這篇文章主要介紹了ES6知識(shí)點(diǎn)整理之?dāng)?shù)組解構(gòu)和字符串解構(gòu)的應(yīng)用,結(jié)合實(shí)例形式分析了ES6數(shù)組解構(gòu)和字符串解構(gòu)的實(shí)現(xiàn)方法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下2019-04-04基于JavaScript實(shí)現(xiàn)數(shù)值型坐標(biāo)軸刻度計(jì)算算法(echarts的y軸刻度計(jì)算)
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)數(shù)值型坐標(biāo)軸刻度計(jì)算算法(echarts的y軸刻度計(jì)算),文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹,感興趣的朋友可以參考與一下2022-06-06在webstorm開(kāi)發(fā)微信小程序之使用阿里自定義字體圖標(biāo)的方法
這篇文章主要介紹了在webstorm開(kāi)發(fā)微信小程序之使用阿里自定義字體圖標(biāo) 的相關(guān)資料,需要的朋友可以參考下2018-11-11詳解JavaScript基于面向?qū)ο笾^承實(shí)例
這篇文章主要介紹了JavaScript基于面向?qū)ο笾^承實(shí)例,需要的朋友可以參考下2015-12-12event.x,event.clientX,event.offsetX區(qū)別
event.x,event.clientX,event.offsetX區(qū)別,需要的朋友可以參考下。2006-11-11微信小程序小組件 基于Canvas實(shí)現(xiàn)直播點(diǎn)贊氣泡效果
這篇文章主要為大家詳細(xì)介紹了微信小程序小組件,基于Canvas實(shí)現(xiàn)直播點(diǎn)贊氣泡效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-02-02js實(shí)現(xiàn)div閃爍原理及實(shí)現(xiàn)代碼
閃爍的原理是什么呢:其實(shí)就一個(gè),display在none與block之間頻繁的交替,這樣說(shuō)你明白了么,示例代碼如下,希望對(duì)大家有所幫助2014-06-06