如何用html代码实现网页上下居中?
1个回答
展开全部
这个问题对很多新手来说都是难以挑战的难度,就是网上有代码很多人都难以了解。其原理很简单,就是把块级元素变成行内元素,定义样式vertical-align:middle,让其垂直居中。这里面有两个难点,1、怎样把块级元素变成行内元素并可以定义大小,而且还要兼容(要了解IElayout)。2、如何用好vertical-align:middle,vertical-align:middle用在表格上很见效,谁都可以用,用在行内元素怎样才能起作用呢等等。
代码我写给你,你自己去琢磨
<style>
.box{display:inline-block;}
.box{*display:inline; *zoom:1; width:50px; height:80px; border:#000 1px solid; vertical-align:middle;}
i{display:inline-block; width:0; height:100%; vertical-align:middle;}
</style>
</head>
<body>
<div style="width:200px; height:200px; border:red 1px solid; text-align:center;">
<i></i>
<div class="box">afdafd</div>
</div>
代码我写给你,你自己去琢磨
<style>
.box{display:inline-block;}
.box{*display:inline; *zoom:1; width:50px; height:80px; border:#000 1px solid; vertical-align:middle;}
i{display:inline-block; width:0; height:100%; vertical-align:middle;}
</style>
</head>
<body>
<div style="width:200px; height:200px; border:red 1px solid; text-align:center;">
<i></i>
<div class="box">afdafd</div>
</div>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询