<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
.outer{
height: 300px;
overflow: hidden;
position: relative;
}
.outer[class]{
display: table;position: static;
}
.middle{
position: absolute;
top: 50%;
}
.middle[class]{
display: table-cell;
vertical-align: middle;
position: static;
}
.inner{
position: relative;
top: -50%;
}
#outerid{
border:1px solid #000;
}
</style>
</head>
<body>
<div class="outer" id="outerid">
<div class="middle">
<div class="inner">
清平调词三首<br/>
其一<br/>
云想衣裳花想容,春风拂槛露华浓。<br/>
若非群玉山头见,会向瑶台月下逢。<br/>
其二<br/>
一枝红艳露凝香,云雨巫山枉断肠。<br/>
借问汉宫谁得似,可怜飞燕倚新妆。<br/>
其三<br/>
名花倾国两相欢,长得君王带笑看。<br/>
解释春风无限恨,沉香亭北倚阑干。<br/>
</div>
</div>
</div>
</body>
</html>
段落垂直对齐方式
最新推荐文章于 2021-06-25 18:37:31 发布