首页 > web前端 > css教程 > 如何让一个div显示在页面最顶层

如何让一个div显示在页面最顶层

醉折花枝作酒筹
发布: 2023-01-04 09:35:58
原创
7866 人浏览过

在css中,可以使用“z-index”属性指定一个元素的堆叠顺序,语法“z-index:值”。数值越大,显示级越高;数值越小,显示级越低。当数值为负数时,表示最底层。

如何让一个div显示在页面最顶层

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

元素的层叠黄金准则:

  • 谁大谁上:当具有明显的层叠水平标识的时候,如生效的z-index属性值,在同一个层叠上下文领域,层叠水平值大的那一个覆盖小的那一个

  • 后来居上:当元素的层叠水平一致、层叠顺序相同的时候,在DOM流中处于后面的元素会覆盖前面的元素

示例:

<div style="z-index:999"></div>
数值越大,显示级越高,当然一般也不用999, 2,3就够了
  <div id="police_computer_network" class="m_wrapper">
                    <ul>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                        <li><a href="#"   target="_blank">全国公安信息网</a></li>
                    </ul>
                    <div class="m_itemMain m_up">全国公安网</div>
</div>
登录后复制

8)L[NIS0MQK9(7N8CP`_UDD.png

推荐学习:css视频教程

以上是如何让一个div显示在页面最顶层的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板