横幅的 php/css/wordpress 问题

Question

我遇到了以下问题。我在我的新网站上使用 wordpress，但我的横幅图片有问题。图片为 150x1020，但由于某种原因，它仍然非常小，不会填满网站的整个宽度。我一直在尝试在 css 编辑器中添加 css，但直到现在还没有结果。我在 wordpress 上使用 Vantage 主题。 enter image description here .有人可以帮我解决这个问题吗？

<?php
/**
 * Part Name: Default Masthead
 */
?>
<header id="masthead" class="site-header" role="banner">

	<div class="hgroup full-container <?php if ( is_active_sidebar( 'sidebar-masthead' ) ) echo 'masthead-sidebar' ?>">

		<?php if ( !is_active_sidebar( 'sidebar-masthead' ) ) : ?>

			<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home" class="logo"><?php vantage_display_logo(); ?></a>
			<?php if ( is_active_sidebar( 'sidebar-header' ) ) : ?>

				<div id="header-sidebar" <?php if ( siteorigin_setting( 'logo_no_widget_overlay' ) ) echo 'class="no-logo-overlay"' ?>>
					<?php
					// Display the header area sidebar, and tell mobile navigation that we can use menus in here
					add_filter( 'siteorigin_mobilenav_is_valid', '__return_true' );
					dynamic_sidebar( 'sidebar-header' );
					remove_filter( 'siteorigin_mobilenav_is_valid', '__return_true' );
					?>
				</div>

			<?php else : ?>

				<div class="support-text">
					<?php do_action( 'vantage_support_text' ); ?>
				</div>

			<?php endif; ?>

		<?php else : ?>

			<?php if ( is_active_sidebar( 'sidebar-masthead' ) ) : ?>
				<div id="masthead-widgets" class="full-container">
					<?php dynamic_sidebar( 'sidebar-masthead' ); ?>
				</div>
			<?php endif; ?>

		<?php endif; ?>

	</div><!-- .hgroup.full-container -->

	<?php get_template_part( 'parts/menu', apply_filters( 'vantage_menu_type', siteorigin_setting( 'layout_menu' ) ) ); ?>

</header><!-- #masthead .site-header -->

#page-wrapper {
  padding-top: 20px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 1080px;
  margin: 0 auto;
}
.layout-full #page-wrapper {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.layout-full #page-wrapper .full-container {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media (max-width: 1080px) {
  .responsive.layout-boxed #page-wrapper {
    margin: 0;
    padding: 0;
  }
  .responsive.layout-boxed #colophon {
    margin-bottom: 0;
  }
}
#masthead {
  background: #fcfcfc;
  padding: 0 35px 0 35px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  zoom: 1;
}
#masthead:before {
  content: '';
  display: block;
}
#masthead:after {
  content: '';
  display: table;
  clear: both;
}
#masthead h1 {
  font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
#masthead h1.logo-title {
  display: inline-block;
  margin-left: 20px;
}
#masthead .hgroup {
  zoom: 1;
  position: relative;
  padding-top: 45px;
  padding-bottom: 45px;
}
#masthead .hgroup:before {
  content: '';
  display: block;
}
#masthead .hgroup:after {
  content: '';
  display: table;
  clear: both;
}
#masthead .hgroup a {
  text-decoration: none;
}
#masthead .hgroup h1 {
  color: #666666;
  font-weight: 100;
  font-size: 36px;
  line-height: 1em;
}
#masthead .hgroup .logo {
  display: block;
  float: left;
  max-width: 100%;
}
#masthead .hgroup .logo img {
  vertical-align: bottom;
}
#masthead .hgroup .support-text {
  line-height: 1.2em;
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -0.6em;
  color: #4b4b4b;
  font-style: italic;
  max-width: 50%;
}
#masthead .hgroup #header-sidebar {
  padding-top: 15px;
  padding-bottom: 15px;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  /* Center align layout. Based on old CSS3 spec, so update when new spec is available and supported */
  -ms-flex-pack: center;
  -ms-flex-align: center;
  display: -ms-flexbox;
  -moz-box-pack: center;
  -moz-box-align: center;
  display: -moz-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  display: -webkit-box;
  display: box;
  box-pack: center;
  box-align: center;
}
#masthead .hgroup #header-sidebar aside.widget {
  margin-bottom: 0;
  float: left;
  position: relative;
  margin-right: 25px;
}
#masthead .hgroup #header-sidebar aside.widget:last-child {
  margin-right: 0;
}
#masthead .hgroup #header-sidebar .widget-title {
  font-weight: bold;
  margin-bottom: 5px;
}
#masthead.masthead-logo-in-menu .main-navigation {
  zoom: 1;
}
#masthead.masthead-logo-in-menu .main-navigation:before {
  content: '';
  display: block;
}
#masthead.masthead-logo-in-menu .main-navigation:after {
  content: '';
  display: table;
  clear: both;
}
#masthead.masthead-logo-in-menu .logo {
  float: left;
  padding: 10px 0;
  margin-right: 15px;
}
#masthead.masthead-logo-in-menu .logo > * {
  display: block;
}
#masthead.masthead-logo-in-menu .logo > img {
  max-height: 33px;
  width: auto;
  height: auto;
  max-width: 100%;
}
#masthead.masthead-logo-in-menu .logo > img.logo-no-height-constrain {
  max-height: none;
}
#masthead.masthead-logo-in-menu .logo > h1 {
  font-size: 20px;
  font-weight: 100;
  padding: 7px 15px;
}
.layout-boxed #masthead.masthead-logo-in-menu img.logo {
  margin-left: 25px;
}

Answer 1

对于那个主题，你需要这个。

#masthead .hgroup .logo {
    max-width: 100%;
    float: none;
}
#masthead .hgroup .logo img {
    width: 100%;
}