1

我需要将导航栏放在标题图像上。我不能在 CSS 中使用背景 url 属性，因为我有多个导航栏和不同页面的标题图像。我希望导航向右浮动，使其与图像偏移，但部分在图像上方。

            Button 1 | Button 2 | Button 3 | Button 4
Header Image

我尝试了很多方法，例如将它们放置相同的 div 并在图像上使用 CSS 绝对位置。这种情况下导航停止工作。当我在导航上使用绝对位置时，我无法将导航向右移动足够远（右：200px）不能再移动！有谁知道如何达到上述预期的结果？提前致谢！HTML PHP

<div id="navigation-container">

 <nav id="np-access" role="navigation">
   <?php if ( (is_page(20) || is_page(22) || is_page(24) || is_page(26) ||    is_page(28)) ) { 
        wp_nav_menu( array( 'theme_location' => 'third') );
   }else{
        wp_nav_menu( array( 'theme_location' => 'secondary') );
   }
?>
 </nav>
</div>

<?php if ( (is_page(20) || is_page(22) || is_page(24) || is_page(26) || is_page(28)) )    { 
    echo '<img src="<path ito image" width="194" height="166"/>';
}
else{
   echo '<img src="<path ito image" width="194" height="166"/>';
}
?>

目前，图像没有按照我需要的位置设置样式。

导航 CSS

#np-wedding-nav{
  float: right;
  padding-right: 100px;
  height: 40px;
  position: relative;
}
4

2 回答 2

0

我希望导航向右浮动，使其与图像偏移，但部分在图像上方。

给导航一个负边距：

nav {margin-left: -100px}

或者位置是相对的：

nav {position: relative; left: -100px}

在任何情况下：更改标记中导航和图像的顺序。

于 2012-12-16T18:32:51.683 回答
-2

请更改标题的顺序和您的html文件的导航，它应该可以工作。

于 2021-07-04T02:27:13.597 回答