2-5编程题效果不一样

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

2-5编程题效果不一样

来源：2-6 编程练习

xiaoyuan1

2017-10-05 17:25:35

<!DOCTYPE html>

<html>

<head>

<style>

/*此处写代码*/

div{

width:300px;

height:300px;

background-image:url(http://climg.mukewang.com/58dc9d360001d65806500650.jpg);

text-align:center;

vertical-align:super;

}

</style>

</head>

<body>

<div>

《长歌行》

<br>

<br>青青园中葵，朝露待日晞。

<br>阳春布德泽，万物生光辉。

<br>常恐秋节至，焜黄华叶衰。

<br>百川东到海，何时复西归。

<br>少壮不努力，老大徒伤悲。

<br>

</div>

</body>

</html>

老师这是代码，和效果不一样。这是我实现的效果。

写回答

1回答

慕设计7452494

2017-10-05

已采纳

要实现垂直居中的话，光一个vertical-align是不行的，可以在这整首诗的外面包一个块级标签（div内，我用的是P），设置div的display:table，p 的display:table-cell 再用vertical-align:middle，就可以实现垂直居中了，你可以试试看。

hiaoyuan1

h 非常感谢！

h017-10-06

共1条回复

0 学习 · 36712 问题

查看课程

相似问题

2-5编程问题

回答 1

2-5编程这样写行吗

回答 1

2-5编程

回答 2

2-5编程练习问题

回答 1

关于练习2-5编程问题的困惑

回答 2

打开慕课网App查看更多内容