使用css 控制弹出框始终水平居中
2015-12-02 10:58
471 查看
使得弹出框的
position:fixed;
距离左侧 left:50%;
然后再知道弹出框宽度的情况下像左偏移 宽度的1/2即可
巩固一下 position
来自 w3c点击打开链接
position:fixed;
距离左侧 left:50%;
然后再知道弹出框宽度的情况下像左偏移 宽度的1/2即可
.invite-dialog { margin-left: -144px; position: fixed; left: 50%; width: 288px; min-height: 166px; background: white; border-radius: 3px; margin-top: 22px; z-index: 99; }
巩固一下 position
absolute | 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 |
fixed | 生成绝对定位的元素,相对于浏览器窗口进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 |
relative | 生成相对定位的元素,相对于其正常位置进行定位。 因此,"left:20" 会向元素的 LEFT 位置添加 20 像素。 |
static | 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。 |
inherit | 规定应该从父元素继承 position 属性的值。 |
相关文章推荐
- CSS垂直与水平居中
- 9款经典华丽的CSS3分享按钮
- DIV+CSS导航学习笔记
- WPF自定义控件与样式(13)-自定义窗体Window & 自适应内容大小消息框MessageBox
- CSS 最核心的几个概念
- WPF自定义控件与样式(13)-自定义窗体Window & 自适应内容大小消息框MessageBox
- 【转】CSS 专业技巧收集
- css样式表
- html 表单 css样式表
- CSS里的各种水平垂直居中基础写法心得
- 使用CSS把ul,li制作成表格
- div+css学习笔记
- 【2】CSS
- CSS3教程:Transform的perspective属性设置
- CSS3多列column布局
- 全局CSS设置
- 浏览器常用兼容性调试技巧
- css中的注意项,可能会帮助到大家哦!
- CSS3 Gradient
- actionBar的tab字体颜色大小样式设置