垂直對齊方式
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>垂直對齊方式</title>
<style>
.box{height:200px;border:2px solid #000; text-align:center;}
.span1{ width:100px;height:200px;background:Red; display:inline-block; vertical-align:middle;}
.span2{ width:200px;height:100px;background:blue; display:inline-block; vertical-align:middle;} /*垂直水平居中對齊*/
</style>
</head>
<body>
<div class="box">
<span class="span1"></span>
<span class="span2"></span>
</div>
</body>
</html>
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章
前端需要謹記的知識備份
1.DOM 節點之間的關係：父子級，兄弟級 節點操作：獲取父子節點，兄弟節點 文檔的根節點：document.documetElement body節點：document.body