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è)面，專門顯示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)文章
手把手教你做超酷的條形碼效果...2007-04-04
JavaScript實(shí)現(xiàn)Tab欄切換特效
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)Tab欄切換特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-06-06
js遍歷詳解(forEach, map, for, for...in, for...of)
在本篇文章里小編給大家整理的是關(guān)于js中的各種遍歷(forEach, map, for, for...in, for...of)相關(guān)知識(shí)點(diǎn)用法總結(jié)，需要的朋友們參考下。2019-08-08
這篇文章主要給大家分享的是常用的js函數(shù)的方法，告別搜索引擎的幫助，提高你的開(kāi)發(fā)效率，,需要的朋友可以參考一下，希望對(duì)你的學(xué)習(xí)有所幫助2021-12-12
Ajax被認(rèn)為是(Asynchronous(異步) JavaScript And Xml的縮寫(xiě)）,現(xiàn)在允許瀏覽器與服務(wù)器通信而無(wú)須刷新當(dāng)前頁(yè)面的技術(shù)都被叫做Ajax,下面這篇文章主要給大家介紹了關(guān)于ajax在js中和jQuery中的用法,需要的朋友可以參考下2021-08-08
基于JS組件實(shí)現(xiàn)拖動(dòng)滑塊驗(yàn)證功能(代碼分享)
拖動(dòng)滑塊驗(yàn)證功能在支付寶，微信各大平臺(tái)都能見(jiàn)到這樣的功能，那么基于js組件是如何實(shí)現(xiàn)此功能的呢？今天小編就給大家分享下js 拖動(dòng)滑塊 驗(yàn)證功能的實(shí)現(xiàn)代碼,需要的朋友參考下吧2016-11-11
javascript GUID生成器實(shí)現(xiàn)代碼
javascript GUID生成器實(shí)現(xiàn)代碼, 需要的朋友可以參考下。2009-10-10
Javascript迭代、遞推、窮舉、遞歸常用算法實(shí)例講解
今天小編就為大家分享一篇關(guān)于Javascript迭代、遞推、窮舉、遞歸常用算法實(shí)例講解，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-02-02
這篇文章主要介紹了使用gulp構(gòu)建前端自動(dòng)化的方法示例，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-12-12
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)手風(fēng)琴特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-11-11