?php echo $logosrc[0];?,如何在一行中显示logo和标题？
我从twentyfourteen开始扩展我的主题。我现在有这个头文件php：
<?php bloginfo( 'name' ); ?>
<?php _e( 'Search', 'twentyfourteen' ); ?>
<?php _e( 'Skip to content', 'twentyfourteen' ); ?>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu', 'menu_id' => 'primary-menu' ) ); ?>
和徽标图像的CSS类：
.site-logo {
float: left;
}
基本主题CSS样式：
.site-title {
float: left;
font-size: 18px;
font-weight: 700;
line-height: 48px;
margin: 0;
/* Nav-toggle width + search-toggle width - gutter = 86px */
max-width: -webkit-calc(100% - 86px);
max-width: calc(100% - 86px);
}
.site-title a, .site-title a:hover {
color: #fff;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
但是徽标显示在网站名称上方…
如何将其对齐为单个字符串？
#1
你需要在此处了解的CSS属性是display属性。 img标签的显示值为inline-block, 因此它具有宽度和高度, 并将显示在同一行上。但是, h1标签的显示值为block。块级元素实际上在其前后放置换行符, 使它们在自己的行上显示。
你可以通过将h1设置为嵌入式元素或嵌入式块元素来克服此问题：
h1 { display: inline-block; }
或通过使用float属性来克服此行为。对于新来者来说, 这将有些棘手。 W3Schools提供了这篇文章, 你可能会发现它很有用。