[英]Html: How to left-align text with centered image?
我需要在網頁上執行以下操作:
-------------------------------------------------------------------
|Normal text |
| |
| Some text aligned to image left |
| ---------------------------------------------------- |
| | Centered image | |
| | | |
| ---------------------------------------------------- |
| |
-------------------------------------------------------------------
我完全不知道該怎么做。 到目前為止,我嘗試過的所有操作都導致文本被認為與圖像的左邊緣對齊,並且也居中:(
謝謝
將文本和圖像放在單個div
元素中。 將div居中,然后將其中的文本左對齊。
普通文本--->以普通方式給出,即不填充
一些文本與圖像左對齊->左移空白
居中圖像----->對齊中心
嘗試這個:
<table style="width:100%;">
<tr>
<td style="width:100%;">>
<div style="text-align:left;">Normal Text</div>
</td>
</tr>
<tr>
<td style="width:100%;">
<table style="width:80%;" align="center">
<tr>
<td style="width:100%;">
<div style="text-align:left;">Some text aligned to image left</div>
</td>
</tr>
<tr>
<td style="width:100%;">
<image url=""></image>
</td>
</tr>
</table>
</td>
</tr>
</table>
試試這個:假設您的圖片大小:800x600 HTML標記
<div id="content">
<img src="something...">
</div>
的CSS
#content img
{
position:relative;
top:50%;
left:50%;
margin-top:-300px;
margin-left:-400px;
}
要么
您可以使用圖片作為背景,
#content
{
background-image:url('bg.png');
background-position:center;
background-repeat:no-repeat;
}
有關background-position
更多信息http://www.w3schools.com/cssref/pr_background-position.asp
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.