zoukankan      html  css  js  c++  java
  • layui-字体图标

    layui官网下载:GitHub:https://github.com/sentsin/layui/

    layui官网首页-下载:http://www.layui.com/

    layui-字体图标-官方网站:http://www.layui.com/doc/element/icon.html

    Layui的所有图标全部采用字体形式,取材于阿里巴巴矢量图标库(iconfont)。因此你可以把一个icon看作是一个普通的文字,这意味着你直接用css控制文字属性,如color、font-size,就可以改变图标的颜色和大小。而区分不同的图标,我们主要是采用 Unicode 字符

    使用:(引入需要的文件)
    通过对一个内联元素(一般推荐用 i标签)设定 class="layui-icon",来定义一个图标,然后对元素加上图标对应的 Unicode 字符,即可显示出你想要的图标,譬如:

    <i class="layui-icon">&#xe60c;</i>   
    其中的 &#xe60c; 即是图标对应的Unicode字符
     
    你可以去定义它的颜色或者大小,如:
    <i class="layui-icon" style="font-size: 30px; color: #1E9FFF;">&#xe60c;</i>  

    示例:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <link rel="stylesheet" type="text/css" href="build/css/layui.css"/>
            <!--<link rel="stylesheet" type="text/css" href="build/css/layui.mobile.css"/>-->
        </head>
        <body>
            <i class="layui-icon" style="font-size: 30px; color: red;">&#xe60c;</i> 
            <script src="js/jquery-2.1.0.js"></script>
            <script src="build/layui.js"></script>
        </body>
    </html>

     输出为:

    ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

  • 相关阅读:
    Nim or not Nim? hdu3032 SG值打表找规律
    Maximum 贪心
    The Super Powers
    LCM Cardinality 暴力
    Longge's problem poj2480 欧拉函数,gcd
    GCD hdu2588
    Perfect Pth Powers poj1730
    6656 Watching the Kangaroo
    yield 小用
    wpf DropDownButton 源码
  • 原文地址:https://www.cnblogs.com/xiangru0921/p/6729111.html
Copyright © 2011-2022 走看看