html - 如何在父 DIV 上显示子 DIV(绝对、隐藏)?

标签 html css

在这种情况下,如何在父 div 之上显示子 div?

<html>
<head>
<style>
.parent {
  position: absolute;
  overflow: hidden;
  z-index: 3;
  white-space: nowrap;
  text-decoration: inherit;
  text-align: center;
  color: inherit;
  left: 5px;
  top: 10px;
  width: 200px;
  height: 30px;
  background-color: red;
}
.child {
  position: relative;
  background-color: blue;
  width: 50px;
  height: 100px;
}
</style>
</head>
<body>
<div class="parent">
    <div class="child"></div>
</div>
</body>
</html>

http://jsfiddle.net/bzf4ru29/2

非常重要的时刻,我无法更改父div的样式(此div已由Eclipse RAP生成,我无法更改)。

最佳答案

.parent {
position: relative;
/* overflow: hidden; */
z-index: 3;
white-space: nowrap;
text-decoration: inherit;
text-align: center;
color: inherit;
/* left: 5px; */
top: 10px;
width: 200px;
height: 30px;
background-color: red;}

.child {
position: absolute;
background-color: blue;
width: 50px;
height: 100px;
z-index: 100;}

你是说这样吗?

关于html - 如何在父 DIV 上显示子 DIV(绝对、隐藏)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30777412/

相关文章:

javascript - 使用视频循环绘制 Canvas

html - Css 与两个 float 元素对齐到中心 td

html - 删除 Bootstrap 表单中的空格

css - CRA + Craco + 多个 CSS 主题

jquery - 如何从右到左无限水平动画 Logo 图像?

javascript - Angular 5从父组件中的数组中删除对象

javascript - 在灯箱的 JQuery 选择器中使用 JS 变量时出现语法错误

css - Chrome 打印预览与 DEVTools 中的不同

css - 如何在弹出式 chrome 扩展中制作边框半径?

css - Django 网站的 Bootstrap 网格