<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <style>

        .modal_cover{

            display: none;

            width: 100%;

            height: 100%;

            position: fixed;

            top: 0;

            left: 0;

            background-color: rgba(0, 0, 0, .6);

        }

        .modal{

            position: absolute;

            width: 823px;

            background: white;

            z-index: 99;

            height: 80px;

            /* 水平垂直居中 */

            left: 50%;

            top: 50%;

            transform: translate(-50%,-50%);

            /* 超出高度右侧出现垂直滚动条 */

            overflow:auto;

            overflow-x:hidden;

        }

        .button{

            margin: 40px;

        }

    </style>

</head>

<body>

    <div class="modal_cover" style="display:block">

        <div class="modal">

            <button class="button">提交申诉</button>

        </div>

    </div>

</body>

</html>

HTML 弹出遮罩层一（遮罩层和内容标签嵌套）的更多相关文章

  1. iOS 仿看了吗应用、指南针测网速等常用工具、自定义弹出视图框架、图片裁剪、内容扩展等源码

    iOS精选源码 扩展内容的cell - folding-cell 一个近乎完整的可识别中国身份证信息的Demo 可自动快速... JPImageresizerView 仿微信的图片裁剪 带年月和至今以 ...

  2. 【转】弹出可拖动的DIV层提示窗口

    来源:www.divcss5.com <html> <head> <meta http-equiv="Content-Type" content=&q ...

  3. jquery实现弹出即消失的提示层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. layer弹出层不居中解决方案，仅显示遮罩，没有弹窗

    问题:项目中layer询问层的弹窗仅显示遮罩层,并不显示弹窗…… 原因:图片太多将layer弹窗挤出屏幕下方,看不见了…… 解决方案:让layer的弹出层居中显示 一.问题描述 用layer做操作结果 ...

  5. div非弹出框半透明遮罩实现全屏幕遮盖css实现

    IE浏览器下设置元素css背景为透明: background-color: rgb(0, 0, 0); filter: alpha(opacity=20); 非IE浏览器下设置元素css背景为透明: ...

  6. js点击弹出div层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. layer弹出层不居中解决方案（转）

    @感谢参考文章 原文内容: 一.问题描述 用layer做操作结果提示时,发现如果页面超出屏幕的高度时,弹出的提示不是屏幕居中,而是在页面高度的中间,如果一个页面的高度比较大,就看不到提示了. 还有一种 ...

  8. layui弹出层基础参数

    一.type-层类型 类型:Number  默认为0(信息框); 1(页面层),可以在页面添加HTML内容 2(iframe层) 3(加载层)加载时显示的弹出框 4(tips层) 需要绑定ID就不展示 ...

  9. 四种常见的提示弹出框（success，warning，error，loading）原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

随机推荐

  1. git常见使用场景总结

    1.怎么回退到之前的commit? 用git reset --hard HEAD回退到最新提交的版本 用git reset --hard HEAD^回退到上一个版本 用git reset --hard ...

  2. Android灯光系统_编写HAL_lights.c【转】

    本文转载自:https://blog.csdn.net/qq_33443989/article/details/77074411 1>. 编写灯光系统的HAL层 之 HAL_light.c1&l ...

  3. excel2010的使用笔记

    新增的 "工具" 主选项卡 不管是word还是excel 的2010 , 在进行编辑一些图片, 图表, 表格等工具的时候, 都会 "动态"的生成相应的 &quo ...

  4. Git 收集别名

    .gitconfig文件夹一般是在C:\Users\Administrator路径下,用于全局的git的配置 下面是git别名的设置: [alias] last = log -1 --stat a = ...

  5. sudo用法记录

    使用root用户,visudo命令(实际是编辑/etc/sudoers文件),用法和vim一样,末行模式:wq退出,如还有提示,使用大写"Q"保存退出,小写"e" ...

  6. js控制的选项卡

    选项卡在各种网站网页上是随处可见的一种形式 今天就简单的讲解下 选项卡得制作方法 首先:思路: 我们做一个四个控制的选项卡  则应该有四个小的DIV 外边包裹着一个大的div 用四个input按钮来控 ...

  7. Java生成指定长度的随机数

    char[] str = {'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', ' ...

  8. redis简介（未完成）

    redis是一个用c语言开发的一个开源的高性能键值对(key-value)数据库,基本类型: 1)字符串型 string 2)字符串列表 lists 3)字符串集合 sets 4)有序字符串集合 so ...

  9. linux 环境下如何完全卸载postgres

    完全删除postgres 小笔记: 1.查看版本号和系统类别:cat  /etc/redhat-realease; 2.如果是redhat:(yum install) a.yum 删除软件包: yum ...

  10. Windows下的Python 3.6.1的下载与安装（适合32bits和64bits）（图文详解）

    不多说,直接上干货! 为什么,这么简单的一个python,我还要特意来写一篇博客呢? 是因为留念下,在使用了Anaconda2和Anaconda3的基础上,现在需安装python3.6.0来做数据分析 ...