鍍金池/ 問答/HTML/ 這圖片為什么水平垂直都不居中？

這圖片為什么水平垂直都不居中？

代碼http://js.jirengu.com/zotex/1...

clipboard.png

回答
編輯回答
雨蝶

clipboard.png

2017年8月30日 15:50
編輯回答
青檸

圖片描述

2017年9月9日 18:57
編輯回答
祈歡

還沒看為什么不能。但是我知道怎么能讓它居中。
此處用了flex布局 Flex 布局教程:語法篇 - 阮一峰的網(wǎng)絡(luò)日志
圖片描述

2017年7月13日 14:15
編輯回答
陌璃
.wrapper4 {
    width: 300px;
    height: 300px;
    border: 1px solid green;
    margin - left: auto;
    margin - right: auto;
    display: table;
    margin - bottom: 60px;
    text - align: center;

}
.wrapper4 img {
    width: 100px;
    height: 100px;
}
.wrapper4 div {
    width: 100px;
    height: 100px;
    display: table - cell;
    vertical - align: middle;
}

<div class="wrapper4">
    <div><img src="http://listenwallstreet.com/wp-content/uploads/2016/03/xiaogou.jpg" alt="小狗"></div>
    
  </div>

需要在外面包裹一層div

2018年1月25日 19:24
編輯回答
深記你
.wrapper4{
    width: 300px;
    height: 300px;
    border: 1px solid green;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 60px;
    vertical-align: middle;
    text-align: center;
    display: table-cell;
   }
.wrapper4 img{
    width:100px;
    height:100px;
}

你把table-cell放錯(cuò)地方了，這個(gè)要用于放圖片的容器中，而不是對(duì)圖片使用table-cell。
組合使用display:table-cell和vertical-align、text-align，是使父元素內(nèi)的所有行內(nèi)元素水平垂直居中，img怎么當(dāng)父元素呢？

2018年5月22日 05:22