如何设计div＆amp;像这样的菜单

Question

我正在设计一个HTML5菜单。 有人能告诉我如何实现附图中的内容吗？ 目前我无法填补菜单图像（绿色）和＆amp;之间的差距。 div背景色（天蓝色）

Answer 1

假设“BLUE BRIDGE”是单独的图像，在每个页面上，特定的菜单标签处于活动状态，通过设置其margin-left属性重新定位图像。

您可以使用Javascript。

getElementByID('blue-bridge').style.marginLeft = "position px";

如果您使用母版页来构建您的网站，那么您可以将一个包含适当位置的简单变量传递给Javascript函数。

EX：在php母版页中：

在内容页面上：

<?php
    $ml=5px; //10px //20px .. depending the page.
    include('masterpage.php');
?>

主页上的

：

function setMargin()
{
    getElementByID('blue-bridge').style.marginLeft = "<?php echo $ml; ?>px";
}

祝你有个美好的一天。

编辑1：忘了告诉;在包含特定图像的相应标签中使用ID。 ：）

Answer 2

z-index菜单更高，并将蓝色置于绿色下？