标题背景图像刚刚停止工作

时间:2017-12-13 作者:Limpuls

所以无缘无故由标题背景图像停止工作。它根本不显示任何内容。我花了一个小时调试,但什么也找不到。我查看了“网络”选项卡,可以看到唯一的徽标。svg被加载,而不是bg。jpg。希望你能发现一些东西。以下是一些代码:

标题。php

<?php
/**
 * The header for our theme
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package okindk
 */

?>
<!doctype html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( \'charset\' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="profile" href="http://gmpg.org/xfn/11">
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <?php wp_head(); ?>
    <?php include \'includes/costumizer.php\'; ?>
</head>

<body <?php body_class(); ?>>
<div id="page" class="site">
    <a class="skip-link screen-reader-text" href="#content"><?php esc_html_e( \'Skip to content\', \'okindk\' ); ?></a>

    <header id="masthead masthead_custom" class="site-header">

        <nav id="site-navigation" class="main-navigation">
            <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( \'Primary Menu\', \'okindk\' ); ?></button>
            <?php
                wp_nav_menu( array(
                    \'theme_location\' => \'menu-1\',
                    \'menu_id\'        => \'primary-menu\',
                ) );
            ?>
            <div id="logo">

            </div>
        </nav><!-- #site-navigation -->
    </header><!-- #masthead -->

    <div id="content" class="site-content">
还有其他风格。css

#masthead_custom {  
    background-image: url("./bg.jpg");
    background-color: #444;
    height: 100vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.6;
    position: relative;;
    z-index: 999999;
}

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

您的标记使用了2个标识符,而不是一个标识符id="masthead masthead_custom"

class="masthead_custom" id="masthead" 将纠正您的问题。

#masthead.masthead_custom { 
    background-image: url("./bg.jpg");
    background-color: #444;
    height: 100vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.6;
    position: relative;;
    z-index: 999999;
}
告诉我它是否有效。

结束

相关推荐

如何使用自定义的css样式访问主题字体?

我希望使用CSS样式在特定位置更改字体。我使用的是optimizer主题,我相信他们使用的库如下:https://fonts.google.com/attribution我正试图将这段文字的字体改为Cinzel,但没有改变。以下是我尝试过的:Attempt 1: <;请选择您的网站:</p>很抱歉,这已经得到了回答,但我的搜索努力没有得到任何结果。谢谢