css - 将大 Logo 堆叠到多个 CSS 上

Question

我有一个基本的网页设计，它有一个页眉、一个中间框(页眉下方的一个大方框)和一个页脚。

我还有一个 Logo 同时占据了中间和标题，所以我很难弄清楚如何正确地切片我的图像。中部和页眉都是纯色，但标志更广泛。有没有一种方法可以使用这种样式的 CSS 并将 Logo 放在多个 CSS 之上？它不是方形 Logo ，所以我不能只在 Photoshop 中将它切片。

谢谢!

CSS:

* {
    margin: 0px;
    padding: 0px;
}
#wrapper {
    height: 1.1in;
    width: 100%;
    background-color: #0277bc;
    position: relative;
}
#wrapper #logo {
    position: relative;
    top: 200px;
    left: 200px;

}

Answer 1

用 position:absolute 做这个。

假设您有一个包含所有内容的 id 的包装器

#wrapper {position: relative;}

然后给你的标志一个 id 并将它定位到包装的左上角

#logo {position: absolute; top: 200px; left: 200px;}

举个例子。

如果它在任何地方覆盖网站内容，您可能需要将 Logo 设为 png