做头部背景

laoliu

做头部背景
1、上传1920/200的图片到根目录/static/image/
2、在后台模板-编辑-页头背景背景地址输入static/image/文件名。输入附加属性输入no-repeat center top cover。
3、自定义模板变量-
新增变量里输入        {HEADERBG}
替换里输入#hd {    background-image: url('static/image/header-bg.png') !important;    background-repeat: no-repeat !important;    background-position: center top !important;    background-size: cover !important;}
4、根目录/template/default/common/里新建extend_common.css文件，编辑里输入/* 页头背景图 */#hd {    background-image: url('static/image/header-bg.png') !important;    background-repeat: no-repeat !important;    background-position: center top !important;    background-size: cover !important;}
单里同时使用了三种方法来实现同一个目标：
后台模板，编辑页头背景设置 ({HEADERBGCODE} 变量)后台模板，
编辑自定义模板变量 ({HEADERBG} 变量)extend_common.css 文件这三种方法的最终目的都是往页面里写入CSS代码。但同时使用它们，可能会造成代码冲突或相互覆盖，而且也不利于排查到底是哪个方法真正生效了。
最推荐、最有效的方法是
第4种：使用 extend_common.css 文件。 这个方法绕过后台所有变量，直接、可靠，且不受模板升级影响。
✅ 推荐操作方案：只保留根目录/template/default/common/里新建extend_common.css文件，编辑里输入/* 页头背景图 */#hd {    background-image: url('static/image/header-bg.png') !important;    background-repeat: no-repeat !important;    background-position: center top !imporant;    background-size: cover !important;}