如何使用定制器动态设置背景图像，而无需将CSS作为内联样式

时间：2020-07-02 作者：Bradley Lewis

这是我目前使用的，

<div class="home-header" style="background-image:url(\'<?php echo get_theme_mod( \'home-header-img\' ); ?>\'); height: 500px; width: 100%; display: flex; justify-content: center; align-items: center; background-repeat: no-repeat">

我的背景图片是由定制者设置的，效果很好，但是由于ThemeForest主题标准，我无法使用内联样式。我应该在这里做什么？还是有更好的办法？谢谢

1 个回复
最合适的回答,由SO网友:ralphjsmit 整理而成

我建议将其更改为：

<div class="home-header" style="background-image:url(\'<?php echo get_theme_mod( \'home-header-img\' ); ?>\')">
并将其添加到样式中。css或其他样式表：

.home-header {
  height: 500px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-repeat: no-repeat;
}
通常，不允许使用内联样式，但Themeforest对背景图像例外。因此，通过移动CSS文件中的剩余代码，只留下图像，就完全符合了Themeforest的要求。中提到了图像的例外情况this article.

让我知道进展如何！

PS：如果要使用添加代码wp_add_inline_styles(), 但我不知道它是如何工作的，我也可以举个例子。

标签： theme-development   theme-customizer   小码农  

相关推荐