css - 如何设计这样的div和菜单

Question

我正在用 HTML5 设计一个菜单。有人可以告诉我如何实现附图中的内容吗？目前我无法填补菜单图像(绿色)和 div 背景颜色(天蓝色)之间的空白

Answer 1

假设“BLUE BRIDGE”是单独的图像，在具有特定菜单选项卡的每个页面上，通过设置其 margin-left 属性重新定位图像。

您可以使用 Javascript。

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

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

例如:在 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。 :)