7.使用相对定位进行div的上下左右居中

最新推荐文章于 2022-04-25 11:47:24 发布

weixin_34224941

最新推荐文章于 2022-04-25 11:47:24 发布

阅读量286

点赞数

原文链接：http://www.cnblogs.com/binhuguang/p/4533858.html

版权

问题：用css分别实现某个DIV元素上下居中和左右居中。

代码：

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <style>
 7         #div1{width:100px;
 8             height:100px;
 9         border:1px solid red;
10          position:absolute;
11             left:50%;
12             margin-left: -50px;
13             top:50%;
14             margin-top:-50px;//div盒子本身高度的一半     
15         }
16     </style>
17 </head>
18 <body>
19 <div id="div1">
20 </div>
21 </body>
22 </html>

要点：使用负值margin对相对定位的div进行位置的微调

转载于:https://www.cnblogs.com/binhuguang/p/4533858.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_34224941

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
7.使用相对定位进行div的上下左右居中

问题：用css分别实现某个DIV元素上下居中和左右居中。代码： 1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style>...
复制链接

扫一扫