Django优化模版拆分css文件

发布时间 2023-09-02 21:54:14作者: 九尾cat

Django优化模版拆分css文件

可以发现前面写项目将css放在html一个文件中,虽然简单省事但是带来的问题就是文件过于冗长不方便查看和修改。这里做个分离优化提供两种方式

方式一:html和css存放同一目录

 将原因html中</style>内容移动到home.css文件中,然后再html移动空白位置,替换指向home.css文件即可:

<head>
  <meta charset="utf-8">
  <title>My Goods</title>
  <link rel="stylesheet" type="text/css" href="/goods_service/templates/home.css">
</head>

方式二: 将css存放到指定目录中【推荐】

 

若是模版文件较多随之拆分的css文件也增多,放在一个目录中显得非常杂乱,这时候可以新建目录,将拆分的css文件统一存放到单独的目录,css内容不变,将home.html修改路径指导css文件即可,同理将移动<style>位置替换如下内容:

<head>
  <meta charset="utf-8">
  <title>My Goods</title>
  <link rel="stylesheet" type="text/css" href="/goods_service/templates/static/home.css">
</head>