前端semantic：解决图标添加无效(django)

最新推荐文章于 2021-01-16 18:43:34 发布

Ctrl_Y

最新推荐文章于 2021-01-16 18:43:34 发布

阅读量2k

点赞数 2

分类专栏： semantic 文章标签： python semantic django

本文链接：https://blog.csdn.net/weixin_41857619/article/details/82934776

版权

semantic 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

环境：win10,python3.6.4,django2.0.5

目录结构

setting同级app目录中加入静态文件

#.settings.py中设置
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'collected_static')
STATICFILES_DIRS = [os.path.join(BASE_DIR, "myweb", "static"), ]

html添加本地连接

#.html中的设置路径
{% load staticfiles %}
<head>
    <meta charset="UTF-8">
    <title>MyWeb</title>
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.3/semantic.css">-->
    <link rel="stylesheet" href="{% static 'css/semantic.css' %}">
    <script src="{% static 'js/jquery.min.js' %}"></script>
    <script src="{% static 'js/semantic.min.js' %}"></script>
</head>

修改semantic.css文件

#.semantic.css中全部替换(./themes/default/assets/fonts/  -> ../fonts/)  
如：src: url("./themes/default/assets/fonts/icons.eot");
改为
src: url("../fonts/icons.eot");
还有图片
background: url("./themes/default/assets/images/flags.png") no-repeat -108px -1976px;
改为
background: url("../images/flags.png") no-repeat -108px -1976px;

然后再加入i标签就能生效了

<div class="ui inverted blue menu">
    <div class="header item">
        Home
        <i class="content icon"></i>
    </div>
</div>

效果如下：

Ctrl_Y

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端semantic：解决图标添加无效(django)

环境：win10,python3.6.4,django2.0.5目录结构setting同级app目录中加入静态文件#.settings.py中设置STATIC_URL = '/static/'STATIC_ROOT = os.path.join(BASE_DIR, 'collected_static')STATICFILES_DIRS = [os.path.join(BAS...
复制链接

扫一扫