看不出来是否垂直居中了啊。。哪位大神帮忙看看代码对不对？-慕课网

首页课程实战体系课手记专栏慕课教程

看不出来是否垂直居中了啊。。哪位大神帮忙看看代码对不对？

来源：15-9 垂直居中-父元素高度确定的多行文本（方法一）

一时一

2019-03-11 18:05

<!DOCTYPE HTML>

<html>

<head>

<title>父元素高度确定的多行文本</title>

<style>

.wrap{height:300px;background:#ccc}

.haixiu{height:300px;vertical-align:middle;}

</style>

</head>

<body>

<div>

<p>看我是否可以居中。</p>

</div>

</td></tr></tbody></table>

<div>

</div>

</td></tr></tbody></table>

</body>

</html>

写回答关注

4回答

贺拉洋子

2019-05-05 13:57:53

如文，<td>自带居中。
.wrap,td{height:300px;background:#ccc} 加个td声明，确定高度和底色就能居中。
或者<td height=300px>确定高度，也能居中，只是没有底色。

0 0
慕莱坞0249791

2019-03-24 22:07:24

直接.wrap后面加个td就行了

0 0
qq_慕桂英4477663

2019-03-15 12:54:44

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>父元素高度确定的多行文本</title>
<style>
.wrap{height:300px;background:#ccc}
.tp{
text-align:center;
}
</style>
</head>

<body>
<table><tbody><tr><td class="wrap">
<div>
<p>看我是否可以居中。</p>
<p>看我是否可以居中。</p>
<p>看我是否可以居中。</p>
<p>看我是否可以居中。</p>
<p>看我是否可以居中。</p>
</div>
</td></tr></tbody></table>


<div class="tp">
<img src="http://img.mukewang.com/54ffac56000169c001840181.jpg" title="害羞的小女生"/>
</div>
</body>
</html>

1 0

qq_慕的地...

这个不对，你只是在横向上做出了居中，你把前面那段删了<table><tbody><tr><td class="wrap"> <div> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> <p>看我是否可以居中。</p> </div> </td></tr></tbody></table> 这段，问题就出来了，这个不算水平居中

2019-06-30 00:44:25

共 1 条回复 >
诺顿Html

2019-03-11 19:14:57

直接给img 图片家加属性，用img { display: block;margin: 0 auto;}虽然有一点投机取巧但是我看其他人也没有找到更好的办法

1 1

weixin...

你这个左右居中了，并没有垂直居中

2019-03-26 17:17:59

共 1 条回复 >