zoukankan      html  css  js  c++  java
  • Bootstrap中img-circle glyphicon及js引入加载更快的存放位置

      第一:响应式椭圆图像的应用

     <div class="container">

                  <img class="img-responsive img-circle" alt="image circle" width="400" height="340" />

      </div>

    效果图如下:

    第二:图标的应用:

    <div class="container">

    <div>搜索图标:<span class="glyphicon glyphicon-search"></span></div>

    <div>打印图标:<span class="glyphicon glyphicon-print"></span></div>

    <div>下载图标:<span class="glyphicon glyphicon-download"></span></div>

     <div>云图标:<span  class=“glyphicon glyphicon-cloud”></span></div>

    <div>信件图标:<span class="glyphicon glyphicon-envelope"></span></div>

    <div>警告图标:<span class="glyphicon glyphicon-alert"></span></div>

    <div>文本居中对齐图标:<span class="glyphicon glyphicon-align-center"></span></div>

    </div>

    由于图标太多这里就不一一列举,值得注意的是有些图标需要引入fonts文件夹,如上面的几个图标中除开云图标和信件图标外,其他图标不引入正确的fonts文件库将导致无法显示,因此我把我的目录也截图下来供参考,注意目录的级别。效果图和目录图如下:

    图标效果图:           目录图:        

    第三:关于js文件在文档最后面的优点:加快页面的加载速度,一般放在</body>标签的前面紧挨:如下图:

  • 相关阅读:
    Linux下redis的安装
    elasticsearch使用时问题
    Elasticsearch 2.x plugin 问题汇总
    elasticsearch-jdbc 插件说明
    ElasticSearch 2.x 问题汇总
    深入JVM《一》
    linux fastdfs 搭建配置(单机)
    mybatis自动generator
    spring-boot mybatis 配置 主从分离 事务
    Maven Nexus
  • 原文地址:https://www.cnblogs.com/professional-NET/p/4719719.html
Copyright © 2011-2022 走看看