FONTAWESOME icon of bootstrap

Source: Internet
Author: User

FONTAWESOME icon of bootstrap

Finally, winform has ushered in the B/S project. We need to write our own front-end page and use bootstrap to build the page. I am very white and I am slowly exploring, mainly records the problems encountered and solutions.

First, display the Time Selection control. I also searched a lot of related components on the Internet, but it may conflict with the js and css I introduced earlier, so the format has never been correct. Later, I created a new page to display the datetimepicker. This time it was very easy.

@ Section CSS {<link href = "~ /Content/admin/css/bootstrap-datetimepicker.min.css "rel =" stylesheet "/> <link href = "~ /Content/admin/css/bootstrap.min.css "rel =" stylesheet "/> // the css to be introduced. However, there is still one missing here, which will be mentioned later .} <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 file to be introduced} <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 ()}); // set some initial attributes of datetimepicker, refer to: http://www.cnblogs.com/yttsic/p/3492834.html </script>

After the control is displayed on the page, I find that something is wrong, because there is no left and right arrows, and after a while, I finally found the corresponding css file, and then Baidu said this, the fontawesome icon is used.

 

Instead of the Glyphicon font icon. (Reference link: https://www.huangwenchao.com.cn/2014/12/font-awesome-css.html), finally suddenly Daming White, I did not add fontawesome icon css file

<Link href = "~ /Content/admin/font-awesome/css/font-awesome.css "rel =" stylesheet "/> // This is one of the few

 

After adding it, it will be complete. (* ^__ ^ *) Hey ......

 

 

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.