22 Z-index 和透明度



/opacity:背景透明度/

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    #box{
      width: 300px;
      height: 200px;
      border: #5a99a8 3px solid;
    }
.tipText{
  color: red;
  z-index: 999;
  /*层级:0~999;默认是0*/
}
.tipBackground{
  width: 300px;
  height: 25px;
  background: black;
  opacity:0.5;
  /*opacity:背景透明度*/
}

li{
  position: absolute;
  top: 100px;
}

  </style>
</head>
<body>
<div id="box">
  <li class="tipText">层级概念和透明度</li>
  <li class="tipBackground"></li>
</div>
</body>
</html>
posted @   被占用的小海海  阅读(12)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?
点击右上角即可分享
微信分享提示