<!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. 彻底了解 suid, sgid ,sticky权限

    sticky: 粘性的, 如 : sticky tape: 粘胶带 /tmp, /var/tmp: 位 sticky: 表示: 第一, 任何用户都可以在该目录下创建文件(编辑自己的文件),第二, 但是 ...

  2. SP6779 GSS7

    GSS7解题报告 前言 唔,有点恶心哪,废了两个多小时debug 思路 很容易看出傻子都知道,这个是树链剖分+线段树的裸题,只不过是恶心了点,这里重点讲一下细节问题 线段树 做过GSS系列的都应该很熟 ...

  3. nohup 让进程在后台可靠运行的几种方法

    1. nohup nohup 无疑是我们首先想到的办法.顾名思义,nohup 的用途就是让提交的命令忽略 hangup 信号. nohup 的使用是十分方便的,只需在要处理的命令前加上 nohup 即 ...

  4. [idea] - 项目启动报错Process finished with exit code 1

    今天运行项目发现一个bug, "C:\Program Files\Java\jdk1.8.0_191\bin\java.exe" -XX:TieredStopAtLevel=1 - ...

  5. .net 打包下载

      ZipArchive 打包下载 private IActionResult DownloadZipFromUrl(string[] guids,string zipFullName) { usin ...

  6. 《机器学习实战》之k-近邻算法（手写识别系统）

    这个玩意和改进约会网站的那个差不多,它是提前把所有数字转换成了32*32像素大小的黑白图,然后转换成字符图(用0,1表示),将所有1024个像素点用一维矩阵保存下来,这样就可以通过knn计算欧几里得距 ...

  7. HDU 3400 Line belt （三分套三分）

    http://acm.split.hdu.edu.cn/showproblem.php?pid=3400 题意: 有两条带子ab和cd,在ab上的速度为p,在cd上的速度为q,在其它地方的速度为r.现 ...

  8. 阿里巴巴数据库连接池 druid配置详解

    一.背景 java程序很大一部分要操作数据库,为了提高性能操作数据库的时候,又不得不使用数据库连接池.数据库连接池有很多选择,c3p.dhcp.proxool等,druid作为一名后起之秀,凭借其出色 ...

  9. 【C#】采用OleDB读取Excel文件转DataTable

    using System; using System.Data; using System.Data.OleDb; using System.IO; using System.Linq; using ...

  10. [jshint] 'import' is only available in ES6 (use 'esversion: 6'). (W119) 提示import等ES6语法的jshint错误的，在代码前加一行 /* jshint esversion: 6 */

    官方下载了vue的简单项目,用vscode打开main.js,代码前出现黄点,js报错了 把鼠标移至import的波浪线上,出现提示:W119 - ‘import’  is only availabl ...