个人中心
gpt4 book ai didi

twitter-bootstrap - Fontawesome 和 bootstrap 图标字体显示不快

转载 作者：行者123 更新时间：2023-11-28 06:51:16 24 4
gpt4 key购买 nike

我正面临这个问题，在显示的许多刷新之后，fontawesome 和 bootstrap 图标字体没有快速显示。

Errorscreenshot 

<!DOCTYPE html>
<!--[if lt IE 7]><html class="ie6" lang="en"><![endif]-->
<!--[if IE 7]><html class="ie7" lang="en"><![endif]-->
<!--[if IE 8]><html class="ie8" lang="en"><![endif]-->
<!--[if IE 9]><html class="ie9" lang="en"><![endif]-->
<!--[if !IE]><!-->
<html class="non-ie" lang="en">
<!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>

<!--[if lt IE 9]>
<script src="inc-media/html5shiv.js"></script>
<script src="inc-media/respond.js"></script>

 <![endif]-->

<!-- core css -->
<link href="inc-media/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="inc-media/reset-bootstrap.css" rel="stylesheet" type="text/css">
<link href="inc-media/checkbox.css" rel="stylesheet" type="text/css">
<link href="inc-media/fonts.css" rel="stylesheet" type="text/css">
<link href="inc-media/style.css" rel="stylesheet" type="text/css">
<link href="inc-media/responsive.css" rel="stylesheet" type="text/css">
<!-- core js -->
<script src="inc-media/jquery.min.js"></script>
<script src="inc-media/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid"> 

    <header>
        <div class="row"> 
            <!-- menu -->

            <div class="col-xs-12 top_nav">
                <div class="frame_wrap clearfix"> 
                    <!-- logo --> 
                    <a href="javascript:;" class="brand"> <img src="inc-media/logo.png" class="img-responsive" /> </a> 
                    <!-- logo /-->

                </div>
            </div>
            <!-- menu /--> 
            <!-- main header (inner header) -->

            <!-- main header (inner header) /--> 
        </div>
    </header>
    <main class="main container">

        <div class="frame_wrap voffset2 clearfix">
            <div class="row">
                <div class="listing_main clearfix pull-left">
                    <header class="listing_head clearfix">


                    </header>
                    <!-- aside --->
                    <aside class="col-xs-3 bl-col filter">
                        <nav class="panel panel-default ns">
                            <div class="panel-body np">
                                <div class="main_row clearfix">
                                    <div class="col-xs-12">
                                        <h2 class="pull-left"><i class="fa fa-search fa-lg"></i> Refine</h2>
                                        <a href="javascript:;" class="btn btn-default dg pull-right voffset2">Clear All</a> </div>
                                </div>
                                <div class="main_row clearfix">
                                    <div class="col-xs-12"> <a href="javascript:;" class="btn btn-default col-xs-12 disabled voffset3 vonset3">Update my Result</a> </div>
                                </div>
                                <div id="accordion">
                                    <div class="accordion_group clearfix">
                                        <div class="accordion_heading"> <a data-toggle="collapse" data-parent="#accordion" href="javascript:;">Keyword <i class="fa fa-chevron-down pull-right"></i></a> </div>
                                        <div class="accordion_body gray col-xs-12 hidden">
                                            <div class="form-group has-feedback nm voffset3">
                                                <input type="text" class="form-control cfc" placeholder="I'm looking for...">
                                                <span class="glyphicon glyphicon-remove form-control-feedback"></span>
                                                <div class="checkbox checkbox-inline voffset1 vonset3">
                                                    <input type="checkbox" id="newsletter" value="option1">
                                                    <label for="newsletter" class="col-xs-8"> Search title & description </label>
                                                </div>
                                            </div>
                                        </div>
                                    </div>




                                    <div class="col-xs-12"> <a href="#"  class="btn btn-primary col-xs-12 voffset3 vonset3">Update my results</a> </div>
                                </div>
                            </div>
                        </nav>
                    </aside>
                    <!-- aside /---> 
                    <!-- listing section --> 
                    <!-- create alert -->

                    <!-- create alert /-->
                    <div class="col-md-9 col-xs-12 bl-col">
                        <div class="col-xs-12 underline np">
                            <h3 class="nm pull-left">Adverts older than today </h3>
                            <ul class="list-unstyled list-inline pull-right vonset">
                                <li class="pl5 np"><a href="" class="btn btn-default btn-xs dg"><i class="fa fa-th-list"></i></a></li>
                                <li class="pl5 np"><a href="" class="btn btn-default btn-xs dg"><i class="fa fa-th"></i></a></li>
                            </ul>
                        </div>
                        <ul class="row bl-row list-unstyled lgv">



                            <li class="col-xs-12 col-sm-4 bl-col">
                                <article class="lm clearfix"> <a href="#">
                                    <div class="thumbnail_container">
                                        <div class="thumbnail thum_img thum_rollover"> <img src="" />
                                            <div class="featured_tag"><span class="featured_tag_text">PREMIUM</span></div>
                                            <span class="hpd_tag label-urgent">Homepage</span> </div>
                                    </div>
                                    </a> <a href="#">
                                    <h2 class="ld_title nm pl10">Low Mileage Mercedes C180 Kompessor 1 owner Imported</h2>
                                    </a> <span class="ad_price pl10 voffset1">Rs. 10 lac</span>
                                    <ul class="list-inline list-unstyled voffset">
                                        <li class="col-xs-6 bl-col eclps"><span class="pl10">Karachi, Pakistan</span></li>
                                        <li class="col-xs-6 bl-col text-right"><span class="pr10">10/26/2015</span></li>
                                    </ul>
                                </article>
                            </li>
                        </ul>
                        <!-- pagination -->
                        <ul class="pager customs_pagination center-block">
                            <li class="np"><a href="#"><i class="fa fa-chevron-left"></i> Previous</a></li>
                            <li class="active"><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li>
                            <li class="np"><a href="#">Next <i class="fa fa-chevron-right"></i></a></li>
                        </ul>
                        <!-- pagination /--> 
                    </div>
                    <!-- listing section /--> 

                </div>

            </div>
        </div>
    </main>
    <!-- footer tab /-->

    <!-- footer tab /-->
    <footer class="row footer">
        <div class="frame_wrap">
            <h3 class="sub-head">Follow Test</h3>
            <ul class="ft-social nav nav-pills">
                <li><a href="javascript:;" class="btn btn-default sm_social_btn dg btn-sm"><span class="fa fa-facebook-f align fb"></span> Like</a></li>
                <li><a href="javascript:;" class="btn btn-default sm_social_btn dg btn-sm"><span class="fa fa-twitter align tweet"></span> Tweet</a></li>
                <li><a href="javascript:;" class="btn btn-default sm_social_btn dg btn-sm"><span class="fa fa-google-plus align gplus"></span> +1</a></li>
                <li><a href="javascript:;" class="btn btn-default sm_social_btn dg btn-sm"><span class="fa fa-pinterest align pint"></span> Pin it</a></li>
            </ul>
            <nav class="ftr_nav">
                <ul class="ftr_nm col-xs-12">
                    <li><a href="#">Help &amp; Contacts</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Car Price Index</a></li>
                    <li><a href="#">Popular Searches</a></li>
                    <li><a href="#">About Bolee</a></li>
                    <li><a href="#">About Bolee</a></li>
                </ul>
            </nav>
            <p class="copyright col-xs-12 np">Copyright © 2015 Test.com. All rights reserved</p>
        </div>
    </footer>
</div>
</body>
</html>

这是 html 让我知道我在其中做错了什么。实际上有时字体显示正确。但是当我再次打开我的网站时，它隐藏起来，只显示空白框或 fl 文本。

最佳答案

它看起来像加载问题。

first you have to check your code hierarchy like these below:

  1. 所有 Jquery (.js) 文件都应位于正文标记之后的页脚
  2. 在本地包含所有(字体、css、js)文件
  3. 确保标题部分中的所有 css 但 fontawesome.css 位置在所有 css 之后将位于底部/li>

尝试一下，希望它会起作用

或者请给我完整的代码

关于twitter-bootstrap - Fontawesome 和 bootstrap 图标字体显示不快，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33752337/

24 4 0
文章推荐： javascript - 如何使网站上的图片移动或连续运动？
文章推荐： html - 有没有办法在html中的contenteditable div中设置插入符号高度
文章推荐： css - 在导航栏菜单中间居中大 Logoh1
文章推荐： jquery - 我的导航栏上升而不是下降
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com