position: static   Z-index 固定是0
position: absolute/relative/fixed   Z-index 有效
在层叠显示上，所有static定位元素看作一个整体，所有绝对定位元素各自成为一层

static ：正常文档流中
relative：在文档流中，但是可相对正常位置定位

absolute：脱离文档流，相对最近的非static父元素定位。有top，left，right，bottom 四个属性，四个属性的默认值是“auto”该值会使得absolute相对“第一个兄弟”元素定位。
fixed：脱离文档流，相对浏览器窗口定位。有top，left，right，bottom 四个属性，四个属性的默认值是“auto”该值会使得fixed相对“第一个兄弟”元素定位。
 

CSS 定位与Z-index的更多相关文章

  1. 有没有想过css定位与xpath的区别

    我是这样理解的, css选择如同你尽可能具体的描述一个元素的形态, 包括他的: 标签, 类, id 以及这些的组合, 目标是尽可能确定元素的唯一坐标 , 以方便选择. 而xpath是根据元素的路径去确 ...

  2. CSS 相对/绝对(relative/absolute)定位与jQuery的控制显示隐藏

    曾经写显示隐藏老是用jq方法控制: dom.show(); dom.hide(); 事实上这样还是有非常多缺陷的. 这是html结构: <div class="holi"&g ...

  3. JS——树形导航菜单（html的ul嵌套，jQuery的css()，show(),hide(),index()等方法）

    必备工具:jquery库文件.我这里用的是1.4版本的. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

  4. Relative 定位与Absolute 定位实例

    一直没有弄懂相对定位与绝对定位之间的关系,今天特来学习一下.本实践都是在360浏览器下测试所得. <!DOCTYPE html> <html> <head> < ...

  5. 手机页面关于头部固定定位与input出现的问题

    前些天写了一个页面,要求头部导航进行固定定位position:fixed.内容区域有输入框input.在大多数手机上都是显示正常的,可偏在一些低版本的手机却出现问题了. 把我给苦恼的不行. 问题:头部 ...

  6. fixed定位与absolute定位

    相同点: 1.fixed定位和absolute定位都是绝对定位 2.fixed定位和absolute定位都脱离了标准文档流, 3.未设置偏移量时,都定位在父元素的左上角 tip:元素设置相对定位或绝对 ...

  7. Python网络爬虫实战(三)照片定位与B站弹幕

    之前两篇已经说完了如何爬取网页以及如何解析其中的数据,那么今天我们就可以开始第一次实战了. 这篇实战包含两个内容. * 利用爬虫调用Api来解析照片的拍摄位置 * 利用爬虫爬取Bilibili视频中的 ...

  8. UI自动化测试（二）浏览器操作及对元素的定位方法（xpath定位和css定位详解）

    Selenium下的Webdriver工具支持FireFox(geckodriver). IE(InternetExplorerDriver).Chrome(ChromeDriver). Opera( ...

  9. Web前端技能

    入门必备的技能: 第1项技能:HTML超文本标记语言: 技能要点: HTML文件的结构    HTML文件的编写方法     HTML基本标记    文字与段落标记     框架    使用表单    ...

随机推荐

  1. RISC-V平台的汇编指令解析

     csrr    a0, 0xF14 //把0xF14的值读入到a0中  andi    a1, a0, 0x1f //把a0 和0x1F按位与运算后存储到a1中 srli    a0, a0, 5 ...

  2. H5 notification浏览器桌面通知

    Notification是HTML5新增的API,用于向用户配置和显示桌面通知.上次在别的网站上看到别人的通知弹窗,好奇之余也想知道如何实现的.实际去查一下发现并不复杂,且可以说比较简单,故写篇博客分 ...

  3. C# 算法之选择排序

    1.简介 选择排序是排序中比较简单的一种,实现的大致思路如下:首先我们拿到一个需要排序的数组,假设该数组的第一个元素是最小的,然后将数组中剩下的元素,于最小的元素进行比较,如果中间有比第一个元素的小的 ...

  4. 使用 IdentityServer4 实现 OAuth 2.0 与 OpenID Connect 服务

    IdentityServer4 是 ASP.NET Core 的一个包含 OIDC 和 OAuth 2.0 协议的框架.最近的关注点在 ABP 上,默认 ABP 也集成 IdentityServer4 ...

  5. centos 7 mariadb安装

    centos 7 mariadb安装 1.安装MariaDB 安装命令 yum -y install mariadb mariadb-server 安装完成MariaDB,首先启动MariaDB sy ...

  6. 面试必备技能-HiveSQL优化

    Hive SQL基本上适用大数据领域离线数据处理的大部分场景.Hive SQL的优化也是我们必须掌握的技能,而且,面试一定会问.那么,我希望面试者能答出其中的80%优化点,在这个问题上才算过关. Hi ...

  7. MongoDB 菜鸟入门“秘籍”

    1.MongoDB介绍 1.1 什么是MongoDB ? MongoDB 是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统. 在高负载的情况下,添加更多的节点,可以保证服务器性能. Mo ...

  8. Web笔记（一） Web 简介与开发环境搭建

    Web应用程序的工作原理 大多数的Web应用程序结构都是采用最为流行的B/S软件开发体系结构,将Web应用程序部署在Web服务器上,只要Web服务器启动,用户就可以通过客户端浏览器发送HTTP请求到W ...

  9. linux的文档和目录结构

    在Linux底下,所有的文件与目录都是由根目录开始,是目录与文件的源头,然后一个个的分支下来,如同树枝状,因此称为这种目录配置为:目录树. 目录树的特点是什么呢? 目录树的起始点是根目录(/,root ...

  10. 网上看到一份详细sql游标说明 《转载 https://www.cnblogs.com/xiongzaiqiren/p/sql-cursor.html》

     SQL游标(cursor)详细说明及内部循环使用示例 游标 游标(cursor)是系统为用户开设的一个数据缓冲区,存放SQL语句的执行结果.每个游标区都有一个名字,用户可以用SQL语句逐一从游标中获 ...