我正在开发移动应用。我试图将图像对准div之外,但不能。 请帮助我,提前谢谢。 这就是我试过的
<div id="page1" data-role="page">
<div data-role="header" data-position='fixed'>
<h1>Center table</h1>
</div>
<div data-role="content">
<div class="centeredTable">
<table>
<tr>
<td>
<img src="http://lorempixel.com/26/26/food/1/" ; />
</td>
<td><a href="#" class="ui-btn ui-corner-all custom-btn ui-shadow ui-mini">sunday</a>
</td>
</tr>
</table>
</div>
</div>
<div> <img src="http://lorempixel.com/26/26/food/1/" ; /></div>
div.centeredTable {
margin: 0 auto;
width: 400px;
background-color: #bbb
}
.centeredTable table {
width: 100%;
}
.centeredTable td {
vertical-align: middle;
text-align: center;
}
.centeredTable tr td:first-child {
width: 20%;
}
.centeredTable tr td:last-child {
width: 80%;
}
我有另一张图片,我想在div之外放置,我无法做到。 如果我这样做,div将不再是中心
答案 0 :(得分:4)
将类添加到imgs parent,例如centeredImage:
<div class="centeredImage">
<img src="http://lorempixel.com/26/26/food/1/" ; />
</div>
然后添加CSS样式:
.centeredImage {
text-align: center;
}
这是DEMO