0

我有一个 div 容器（标题）

div.header {
    width: 1024px;
    height: 115px;
    background-color: black;
}

其中包含一个名为 header_title 的 h1，其中包含一个文本：

#header_title {
    font: 80px 'Oxygen', sans-serif;
    letter-spacing: -8px;
    margin-left: 25px;
    text-shadow: 500px 35px 18px white, 300px -50px 30px lightblue;
}

就在标题 div 的下方，我有我的菜单，就像你在我的图片中看到的那样。

如果我设置了一个文本阴影，它将离开 div，（第 4 个字母，一个'g'）我可以让它显示并且不被切断吗？

我尝试了溢出：可见和 z-index 解决方案，但它不起作用 =(

谢谢。

在此处输入图像描述

标头标记：

 <div class=header>
      <h1 id=header_title>Programmazione</h1>
 </div> <!-- fine header -->    

 <div class=menu>
     etc......
4

2 回答 2

1

尝试删除 的height属性header并给它一个padding-bottom大约 15px 的阴影。这应该够了吧。

于 2012-04-28T18:29:53.907 回答
0

我没有你的 HTML 标记来测试和确定，但我相信正在发生的事情是阴影超出了标题 div。在您提供的 CSS 中，我看不出有什么理由不会。

发生的事情是后面的菜单图像阻止了它。对于大多数浏览器来说，如果你默认定位项目（即不是绝对的、不是相对的、不是固定的），那么在它们重叠的情况下，下面的邻居在上面。此外，如果您以这种方式定位元素，z-index 不会影响它们。z-index 仅适用于相对、绝对和固定元素。

一种解决方案是给两个元素position:relative; 然后使用z-index将标题 div 的位置高于菜单。

于 2012-04-28T18:32:45.047 回答