父元素有兩個子元素,兩個子元素需要并排顯示,右側的子元素內容不固定,需要讓左側的元素隨右側子元素的變化而自適應垂直居中父元素
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
* { padding: 0; margin: 0;
} #demo { width: 410px; border: 1px solid red;
} .sample-1 { display: inline-block; width: 200px; border: 1px solid black;
} .sample-2 { width: 200px; display: inline-block; border: 1px solid orange;
} </style></head><body>
<div id="demo">
<div class="sample-1">
我是一行文字需要自適應垂直居中 </div>
<div class="sample-2">
在移動端如果使用body滾動,意思就是頁面的高度由內容自動撐大,body自然形成滾動條,這時我們監聽window.onscroll,發現onscroll并沒有實時觸發,只在手指觸摸的屏幕上一直滑動時和滾動停止的那一刻才觸發,采用了wk內核的webview除外。 </div>
</div></body></html>
子元素隨著兄弟元素自適應垂直居中
慕桂英546537
2018-07-22 08:06:12