Django CMS 动态图像

Question

我需要在 django cms 中从主页更改动态图像背景图像 css，但这是不可能的。

home

CSS 代码

css有welcome-image-area类，用户需要更改cms中的图片url。

.welcome-area {
    height: 100%;
}

.welcome-image-area {
    position: relative;
    height: 100%;
    background-image: url(../images/bg/bg.jpg); 
    background-size: cover;
    z-index: 1;
}

.welcome-image-area:after {
    position: absolute;
    background: rgba(0, 0, 0, .7);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -1;
}

HTML 代码

base.html

  <div id="welcome-image-area" class="welcome-image-area" data-stellar-background-ratio="0.6" >
              <div class="display-table">
                  <div class="display-table-cell">
                      <div class="container">
                          <div class="row">
                              <div class="col-md-12 text-center">
                                  <div class="header-text">
                                      <h2>{% static_placeholder 'mensaje bienvenida' %}</h2>
                                      <p>{% static_placeholder 'sub mensaje bienvenida' %}</p>
                                      <a class="smoth-scroll hire-us-slide-btn" href="#service">Servicios <i class="fa fa-hand-pointer-o btn-hire-us" aria-hidden="true"></i></a>
                                      <a class="slide-btn smoth-scroll" href="#contact">Contactanos <i class="fa fa-hand-pointer-o btn-contact-us" aria-hidden="true"></i></a>
                                  </div>
                              </div>
                          </div>
                      </div>
                  </div>
              </div>
          </div>

Answer 1

在这些情况下，我建议使用“样式”属性，如下所示：

<div class="welcome-image-area" style="background-image: url({{ instance.image.url }})"></div>