zoukankan      html  css  js  c++  java
  • Django学习路29_css样式渲染 h3 标签

    在 static 静态文件夹下创建 css 文件夹 home.css 
    此时 home.css 路径是 'static/css/home.css'
    
    在 对应的 home.html 文件中添加 css 样式
    
    {% block ext_css %}
    {#    <link rel="stylesheet" href="/static/css/home.css">#}
    {#    导入样式#}
        <link rel="stylesheet" href="{% static 'css/home.css' %}"
    {#       使用相对路径#}
    {% endblock %}
    
    注:
    导入方式:
     <link rel="stylesheet" href="/static/css/home.css">
    使用绝对路径,如果路径修改,则很容易出错
    
    <link rel="stylesheet" href="{% static 'css/home.css' %}"
    使用相对路径,在使用之前,要先在项目的 settings 中添加
    
    STATIC_URL = '/static/'
    
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR,'static'),
    ]
    通知项目,存在该目录
    home.html 内容
    
    {% extends 'base.html' %}
    {#继承 base.html #}
    {% load static %}
    {% block header %}
    <h2> header 模块 第一次继承 .html 文件</h2>
    {% endblock %}
    
    {% block footer %}
    {% include 'footer.html' %}
    
    {% endblock %}
    
    {% block ext_css %}
    {#    <link rel="stylesheet" href="/static/css/home.css">#}
    {#    导入样式#}
        <link rel="stylesheet" href="{% static 'css/home.css' %}"
    {#       使用相对路径#}
    {% endblock %}
    home.css 内容
    标签名{
      属性:值;    
    }
    
    h3{
        color:green;
    }
    本次使用的是 footer.html  继承了 home.html 的子类
    
    footer.html 内容
    
    {% extends 'home.html' %}
    
    {% block footer %}
    
        <h3> 继承了 子类 home 的 类,显示块为 footer </h3>
    {% endblock %}
    
    
    {% block header %}
        {{ block.super }}
        继承了 子类 home 的 类,显示块为 header
    {% endblock %}
    
    
    {% block content %}
        <h3>做一件事,就把这件事做好</h3>
    
    {% endblock %}
    在 urls 中注册
    
     url(r'footer',views.footer)
    
    在 views 中实现
    
    def footer(request):
    
        return render(request,'footer.html',context={'title':'footer'})

     


    注:
    在 settings 中的 
    DEBUG = True
    
    当 DEBUG 为 False 时,会发生界面找不到

     


    核心语句写法:
    
    导入:
    <link rel = "stylesheet" href = "{%static '相对路径'%}">
    
     <link rel="stylesheet" href="{% static 'css/home.css' %}"
    
    
    继承:
    {% extends '文件名.html'%}
    
    {% extends 'base.html' %}
    {% extends 'home.html' %}
    
    css 样式:
    标签名{
      属性:值;
    }
    
    h3{
        color:green;
    }

    千万要进行注册
    
    STATIC_URL = '/static/'
    
    STATICFILES_DIRS = [
        os.path.join(BASE_DIR,'static'),
    ]

    2020-05-16

  • 相关阅读:
    更改滚动条样式
    进度条代码
    css实现线条样式(中间高亮,两边透明)
    实现瀑布流布局 https://blog.csdn.net/csdn_zsdf/article/details/69367182
    css实现等高布局
    select多选框默认第一个是---请选择---
    后台返回的数据换行显示
    js实现文字无间断上下滚动
    用swiper实现类似淘抢购的滑动tab效果
    解决iframe高度自适应的问题
  • 原文地址:https://www.cnblogs.com/hany-postq473111315/p/12899854.html
Copyright © 2011-2022 走看看