wordpress的新设计师。我想把一个帖子的特色图片，并使其成为一个英雄形象的帖子单页。
我通常的做法是创建一个div，将width设置为100%，height设置为我想要的任何vh，然后将background设置为CSS中的图像url，background size设置为cover。
所以我在Wordpress中是这样做的：
<section class="hero" style="background: url(\'<?php echo $hero_image[\'url\'];?> \');" xmlns="http://www.w3.org/1999/html">
但这有点不可靠，因为使用内联样式设置背景会将所有CSS覆盖回默认元素。关于如何做得更好，有什么想法吗？最好没有任何插件，因为我正在努力学习如何尽可能多地使用代码。虽然我已经安装了高级自定义字段和自定义Post类型UI，而且我正在广泛使用它们。
最合适的回答,由SO网友:David A. French 整理而成
因此，杰克的答案是有效的，而且是正确的，但我也为我已经拥有的东西找到了一个更优雅的解决方案。我制作了内联样式的背景图像，而不是背景：
<section class="hero" style="background-image: url(\'<?php echo $hero_image[\'url\'];?> \');" xmlns="http://www.w3.org/1999/html">
SO网友:Johansson
您可以挂接到主题的标题并添加您的样式。将这段代码添加到主题的functions.php 文件：
<?php
add_action(\'wp_head\',\'my_hero_image\');
function my_hero_image() {
if( is_single() ) { ?>
section.hero {
background-image: <?php the_post_thumbnail_url(\'full\'); ?>;
background-size: cover;
} <?php
}
}
?>
这将在单个帖子的主题标题中添加以下样式：
<style>
section.hero {
background-image: YOUR IMAGE URL;
background-size: cover
}
</style>
这样就行了。
