Question

我在检查员中对此进行了编辑，并希望它在CSS中实现。

    <div id="av_section_1" class="avia-section main_color avia-section-default avia-no-border-styling avia-full-stretch avia-bg-style-scroll  avia-builder-el-0  el_before_av_section  avia-builder-el-first  av-minimum-height av-minimum-height-custom container_wrap fullsize" style="background-repeat: no-repeat; background-image: url(https://download.unsplash.com/34/BA1yLjNnQCI1yisIZGEi_2013-07-16_1922_IMG_9873.jpg); background-attachment: scroll; background-position: top right; " data-section-bg-repeat="stretch">

有人可以帮助我将其转换为CSS并让它超过骑在那里的东西吗？

由于

Answer 1

只需添加一个类并为其命名，在someClass文件中说CSS：

.someClass {
    background-repeat: no-repeat !important;
    background-image: url(https://download.unsplash.com/34/BA1yLjNnQCI1yisIZGEi_2013-07-16_1922_IMG_9873.jpg) !important; 
    background-attachment: scroll !important; 
    background-position: top right !important;
}

然后按如下方式修改div标签：

 <div id="av_section_1" class="avia-section main_color avia-section-default avia-no-border-styling avia-full-stretch avia-bg-style-scroll  avia-builder-el-0  el_before_av_section  avia-builder-el-first  av-minimum-height av-minimum-height-custom container_wrap fullsize someClass" data-section-bg-repeat="stretch"></div>

稍微解释一下，使用!important将覆盖同一属性的任何其他值。因此，someClass将完全应用。

只是为了让你知道，我在你的div标签上使用这么多课程并不是很舒服。我建议尽量减少类的数量，以便简化可维护性。

注意：你也可以按如下方式内联：

<div id="av_section_1" class="avia-section main_color avia-section-default avia-no-border-styling avia-full-stretch avia-bg-style-scroll  avia-builder-el-0  el_before_av_section  avia-builder-el-first  av-minimum-height av-minimum-height-custom container_wrap fullsize someClass" data-section-bg-repeat="stretch" style="background-repeat: no-repeat !important;background-image: url(https://download.unsplash.com/34/BA1yLjNnQCI1yisIZGEi_2013-07-16_1922_IMG_9873.jpg) !important;background-attachment: scroll !important;background-position: top right !important;"></div>

希望这有帮助!!!

如何将其转换为CSS？

1 个答案: