让一个元素垂直水平居中的三种方法

2022-06-19    分类： 网站建设

第一种方法:

div.box{

weight:200px;

height:400px;

position:absolute;

left:50%;

top:50%;

margin-left:-100px;

margin-top:-200px;

}

*兼容性好;缺点:必须知道元素的宽高

-------------

第二种方法：

div.box{

weight:200px;

height:400px;

position:absolute;

left:50%;

top:50%;

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

}


*这是css3里的样式;缺点:兼容性不好，只支持IE9+的浏览器


---------------

第三种方法

div.box{

weight:200px;

height:400px;

position:absolute;

left:0;

right:0;

top:0;

bottom:0;

margin:auto;

}


*兼容性较好，缺点:不支持IE7以下的浏览器

网站标题：让一个元素垂直水平居中的三种方法
URL标题：https://www.cdcxhl.com/news/169103.html

成都网站建设公司_创新互联，为您提供服务器托管、虚拟主机、小程序开发、品牌网站建设、网站制作、移动网站建设

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

猜你还喜欢下面的内容

搜索引擎优化

网站建设知识

分类信息网