easyui tree()使用font-awesome字体图标解决方法

时间：2021-09-30 16:13:57 +0800 CST 浏览：2347

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "//www.w3.org/TR/html4/loose.dtd">
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="keywords" content="jquery,ui,easy,easyui,web" />
    <meta name="description" content="easyui help you build your web page easily!" />
    <title>jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="//www.jeasyui.net/Public/js/easyui/themes/default/easyui.css" />
    <link rel="stylesheet" type="text/css" href="//www.jeasyui.net/Public/js/easyui/themes/icon.css" />
    <script type="text/javascript" src="//code.jquery.com/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" src="//www.jeasyui.net/Public/js/easyui/jquery.easyui.min.js"></script>
    <link href="//cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet" />
    <style>
        .tree-icon {
            font: normal normal normal 12px/1 FontAwesome;
            font-size: 15px !important;
            background: none;
        }

        .tree-folder:BEFORE {}

        .tree-folder-open:BEFORE {}

        .tree-file:BEFORE {}
    </style>
</head>

<body>
    <ul id="tt"></ul>
    <script>
        $(function () {
            $('#tt').tree({
                data: [{
                    text: 'Item1',
                    iconCls: "fa fa-home",
                    state: 'closed',
                    children: [{
                        iconCls: "fa fa-home",
                        text: 'Item11'
                    }, {
                        iconCls: "fa fa-home",
                        text: 'Item12'
                    }]
                }, {
                    iconCls: "fa fa-home",
                    text: 'Item2'
                }]
            });
        });
    </script>
</body>

</html>

附上效果图

easyui-tree-
fontIcon.jpg

Other

如果这篇文章对你有所帮助，可以通过下边的“打赏”功能进行小额的打赏。

本网站部分内容来源于互联网，如有侵犯版权请来信告知,我们将立即处理。

来说两句吧

分类导航

Golang Linux Git Database FFmpeg Game Python Node.js .Net Java MacOS Windows Sharing Other