0
我試圖在一行中得到三個圖像,一個左對齊,一個居中,最後一個右對齊。我已經決定使用單行表來做到這一點,但我很難讓圖像集中在各自的單元格中。單排表格中的中心圖像
有沒有比我選擇的更好的方法呢?我不打算使用<td align="center">
屬性,因爲它在HTML5中已被棄用,所以我正在尋找一種使用CSS的方法。這是我目前所面對的(我設置表格邊框屬性爲「1」,所以我可以看到小區內的影像對準如何呈現):
<style>
.centre_image
{
float:center;
}
</style>
<body>
<table border="1">
<tr>
<td class="centre_image">
<object type="image/svg+xml" data="images/lawfirms.svg">
<img src="images/lawfirms.png" alt=""/>
</object>
</td>
<td class="centre_image">
<object type="image/svg+xml" data="images/industry.svg">
<img src="images/industry.png" alt=""/>
</object>
</td>
<td class="centre_image">
<object type="image/svg+xml" data="images/in-house.svg">
<img src="images/in-house.png" alt=""/>
</object>
</td>
</tr>
</table>
此給出以下結果在Firefox 19.0在Ubuntu:
,並得到以下結果在Chrome 25.0:
編輯 - 這裏是做在j08691的答覆中提到的修改後的完整的HTML:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8"/>
<title>SVG Included with <object> tag</title>
<style>
.centre_image
{
text-align:center;
}
</style>
</head>
<body>
<table border="1" style="width:100%">
<tr>
<td class="centre_image">
<object type="image/svg+xml" data="images/lawfirms.svg">
<img src="images/lawfirms.png" alt=""/>
</object>
</td>
<td class="centre_image">
<object type="image/svg+xml" data="images/industry.svg">
<img src="images/industry.png" alt=""/>
</object>
</td>
<td class="centre_image">
<object type="image/svg+xml" data="images/in-house.svg">
<img src="images/in-house.png" alt=""/>
</object>
</td>
</tr>
</table>
</body>
</html>
這裏是納雷什·庫馬爾的回答結果:
浮點屬性沒有'center'值也請設置一個[** jsFiddle **](http://jsfiddle.net) – Adrift 2013-03-14 16:31:26
嘗試重置您的。css行爲爲