在 wordpress 中,我已经能够修改菜单以显示在左侧,但我有我想在导航菜单末尾显示的社交图标(facebook、twitter..etc)。现在我所做的是修改我的 header.php 文件并插入带有这些图标的 UL 列表以显示在菜单的底部..但是你可以看到它是重叠的。好吧,这是正在发生的事情的图像..以下是我拥有的代码..
<nav id="access" role="navigation">
<h3 class="assistive-text"><?php _e( 'Main menu', 'twentyeleven' ); ?></h3>
<?php /* Allow screen readers / text browsers to skip the navigation menu and get right to the good stuff. */ ?>
<div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to primary content', 'twentyeleven' ); ?>"><?php _e( 'Skip to primary content', 'twentyeleven' ); ?></a></div>
<div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e( 'Skip to secondary content', 'twentyeleven' ); ?>"><?php _e( 'Skip to secondary content', 'twentyeleven' ); ?></a></div>
<?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assigned to the primary location is the one used. If one isn't assigned, the menu with the lowest ID is used. */ ?>
<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
</nav><!-- #access -->
<ul class="social">
<li><a class="youtubeicon" href="#LinkURL">youtube</a></li>
<li><a class="facebook" href="#LinkURL">facebook</a></li>
<li><a class="twitter" href="#LinkURL">twitter</a></li>
<li><a class="pinterest" href="#LinkURL">pinterest</a></li>
<li><a class="favorite" href="#LinkURL">favorite</a></li>
</ul>
CSS:
ul.social{margin:10px 0 0 25px;}
ul.social li{float:left; padding:2px;}