栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > Html/CSS > CSS教程

完全纯css实现div自适应居中兼容IE7 Chrome FireFox

CSS教程 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

完全纯css实现div自适应居中兼容IE7 Chrome FireFox

1. 纯CSS,完全无需JS,对JS程序猿来说一种解放!

2. IE7、8 下rgba属性会失效,所以如果要做半透明要新加一个div,这个步骤我偷个懒就省了哈哈,重点是中间的div大笑

3. 对于弹出层,各位针对自己的情况设置z-index,这里我没有设置了

4. IE6没有测试,抱歉= =

DOM结构

复制代码代码如下:







fdsfsdfsadfsdafsdafdssad










感觉如何?









stye.css :

复制代码代码如下:
.pop-wrap{
position: fixed;
top: 0;
background: rgba(0, 0, 0, .8);
left: 0;
width: 100%;
height: 100%;
}
.pop-wrap table {
height: 100%;
width: 100%;
}
.pop-wrap td {
width: 100%;
height: 100%;
}
div.pop {
margin: 0 auto;
width: 200px;
background: #ECECEC;
padding: 20px;
text-align:center;
}
div.pop p {
font: 200 14px/20px Microsoft YaHei;
}
div.pop input {
background: #FFFFFF;
border: 1px solid #ADADAD;
padding: 3px 10px;
border-radius : 2px;
cursor: pointer;
}
转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/217036.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号