我最近被分配了复制我们以前的Web开发者制作的JS弹出窗口的工作.我有一个非常相似但有一件事我不能得到,关闭按钮(X)漂浮在弹出的右上角的弹出窗口(而不是坐在弹出窗口的右上角).我已经尝试了在Stack和Stack中发现的CSS和其他属性中的position:值,但是没有一个似乎没有办法.

CSS:

#popup {

position:absolute;

display:hidden;

top:50%;

left:50%;

width:400px;

height:586px;

margin-top:-263px;

margin-left:-200px;

background-color:#fff;

z-index:2;

padding:5px;

}

#overlay-back {

position : fixed;

top : 0;

left : 0;

width : 100%;

height : 100%;

background : #000;

opacity : 0.7;

filter : alpha(opacity=60);

z-index : 1;

display: none;

}

.close-image {

display: block;

float:right;

cursor: pointer;

z-index:3

}

HTML:

html一个div浮动在另一div上,css – 在另一个DIV的顶部浮动DIV相关推荐

  1. 【CSS】绘制一个任意角度的扇形

    现在有这样一个需求,我们要用html 和 css绘制这样一个图形(sry,这水印不知道咋去掉,o(╯□╰)o): 我们首先可能想到的就是先画三角形,然后使用border-radius,是的我也是这样想 ...

  2. [css] 怎样把一个div居中?怎样把一个浮动元素居中?怎样把绝对定位的div居中?

    [css] 怎样把一个div居中?怎样把一个浮动元素居中?怎样把绝对定位的div居中? 主要用到:text-alin: center;margin: 0 auto;position: relative ...

  3. 固定-浮动定位在顶部的div

    固定-浮动定位在顶部的div <!DOCTYPE HTML> <html lang="en-US"> <head> <meta chars ...

  4. [译] 关于CSS中的float和position (父容器div内的子元素div为float时,父元素无法撑开(或高度自适应)的解决方式)

    测试案例:http://blog.csdn.net/goodshot/article/details/44408245 当构建页面排版时,有不同的方法可以使用.使用哪一种方法取决于具体页面的排版要求, ...

  5. Div+CSS布局入门教程(四) 页面顶部制作之二

    使用列表<li>制作菜单 开始此节的学习前,请确认你已经参照之前的几节内容写入了DIV.CSS到index.htm和css.css文件中. 这一节我将告诉大家如何用列表<li> ...

  6. 一个简单的网站设计与实现(HTML+CSS)---钻戒官网(5页浮动布局)

    ⛵ 源码获取 文末联系 ✈ Web前端开发技术 描述 网页设计题材,DIV+CSS 布局制作,HTML+CSS网页设计期末课程大作业 | 公司官网网站 | 企业官网 | 酒店官网 | 等网站的设计与制 ...

  7. Div+CSS布局入门教程(三) 页面顶部制作之一

    当我们写好了页面大致的DIV结构后,我们就可以开始细致地对每一个部分进行制作了. 在上一章中我们写入了一些样式,那些样式是为了预览结构而写入的,我们把css.css中的样式全部清除掉,重新写入以下样式 ...

  8. 哪种css实现方式优势更突出_css和div的优势有哪些?

    CSS+DIV是网站标准(或称"WEB标准")中常用的术语之一,通常为了说明与HTML网页设计语言中的表格(table)定位方式的区别,因为XHTML网站设计标准中,不再使用表格定 ...

  9. CSS系列之美化网页/span标签和div标签/字体样式/文本样式

    CSS系列之美化网页/span标签和div标签/字体样式/文本样式 01 span标签和div标签 span标签的作用 能让几个文字或者某个词语凸显出来 属于行内元素 div标签 属于块级元素 程序示 ...

最新文章

  1. 如何解决某个端口被谁占用?
  2. JS高级:事件冒泡和事件捕获;
  3. 微软为 Visual Studio 推出新的 Razor 编辑器
  4. “360行,行行转前端”:前端岗为什么这么火?
  5. java重新连接tcp,如何处理TCP客户端丢弃和重新连接
  6. Visual C++ 微软常用运行库合集
  7. 应用化工技术学计算机不,化工技术类包括哪些专业
  8. 【java毕业设计】基于javaEE+Mybatis的WEB仓库管理系统设计与实现(毕业论文+程序源码)——仓库管理系统
  9. FreeSWITCH会议指南
  10. 4am永远 鼠标按键设置_罗技的MX Master鼠标是苹果Mac系统下最好的鼠标
  11. 寻梦港家政上门服务小程序微擎
  12. 计算机键盘在哪里,电脑键盘上的Pause键在哪?
  13. Ubuntu14.04 Firefox无法播放视频
  14. CES2020 | 小牛电动成为科技出行的“另类”标杆
  15. 解决REFERENCEERROR: primordials is not defined问题
  16. 什么是Android内核
  17. 内核文件管理-IRP(一)创建或打开文件
  18. 给王凌打Call的,原来是神奇的智能湖仓
  19. 读透《阿里巴巴数据中台实践》,其到底有什么高明之处?
  20. pdf 电子签章 java_利用itextpdf实现简单的电子签章/水印等

热门文章

  1. Spring Cloud Gateway之负载均衡
  2. http强制跳转https,POST请求变成GET
  3. DotNetCore跨平台~xUnit和测试报告
  4. 解决beautifulsoup代码无效问题
  5. K/3Cloud 分页报表示例参考
  6. [转载] C#面向对象设计模式纵横谈——8. Bridge桥接模式
  7. 【MM模块】Invoice for POs with Acc Assignment 科目指派
  8. 关于mysql报 loopWaitCount 0, wait millis 60000 错误的解决办法
  9. SAP设置信贷控制范围有什么作用?
  10. SAP系统上线支持维护制度