怎么設置中間的文字能隨著長度的變化而自動垂直居中
喵喔喔
2018-11-15 11:10:12
1 回答
慕碼人8056858
TA貢獻1803條經驗 獲得超6個贊
直接設置上下相同的padding就可以了， 可以在任何瀏覽器上運行，并且代碼很簡單，只不過這種方法應用的前提就是容器的高度必須是可伸縮的。。而高度變化正好是題主的要求。demo:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<title> 多行文字實現垂直居中 </title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.tx-verti-center{
padding: 25px;
border: 1px solid #FF0099;
width: 760px;
}
</style>
</head>
<body>
<div class="tx-verti-center">
現在我們要使這段文字垂直居中顯示！阿薩德黃金卡撕掉會阿薩德卡時間段卡拉膠考慮到靜安寺來看待
阿薩德黃金卡撕掉會阿薩德卡時間段卡拉膠考慮到靜安寺來看待
阿薩德黃金卡撕掉會阿薩德卡時間段卡拉膠考慮到靜安寺來看待
</div>
<div class="tx-verti-center">
現在我們要使這段文字垂直居中顯示！阿薩德黃金卡撕掉會阿薩德卡時間段卡拉膠考慮到靜安寺來看待
</div>
</body>
</html>
添加回答
舉報
0/150
提交
取消