Question

我正在网站上工作（这是我作为开发人员的第一个网站），我想知道是否有人可以帮助我将这些项目水平对齐彼此相邻的项目。我不知道如何编写HTML代码，所以我对此完全不熟悉。在开发网站的大部分时间里，我会去网上提供帮助，但是这个例子我在你的帮助下。

该网站正在使用WordPress，这将成为一个页面。使用W-P Table重新加载的表格和Google地图。这是目前的代码：

<p style="text-align: left;">[table id=4 /]<small></small></p><p style="text-align: right;">
<iframe src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Avie's+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;aq=&amp;sll=41.375316,-71.831092&amp;sspn=0.006948,0.016512&amp;vpsrc=0&amp;g=100+Main+Street,+Westerly,+R+02891-2194&amp;ie=UTF8&amp;hq=Avie's+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;hnear=&amp;radius=15000&amp;t=m&amp;ll=41.379063,-71.831102&amp;spn=0.015457,0.027466&amp;z=15&amp;iwloc=lyrftr:m,9024240540147588029,41.375323,-71.831043&amp;output=embed" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="640" height="480"></iframe>
<small><a style="color: #0000ff; text-align: left;" href="http://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=Avie%27s+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;aq=&amp;sll=41.375316,-71.831092&amp;sspn=0.006948,0.016512&amp;vpsrc=0&amp;g=100+Main+Street,+Westerly,+R+02891-2194&amp;ie=UTF8&amp;hq=Avie%27s+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;hnear=&amp;radius=15000&amp;t=m&amp;ll=41.379063,-71.831102&amp;spn=0.015457,0.027466&amp;z=15&amp;iwloc=lyrftr:m,9024240540147588029,41.375323,-71.831043">View Larger Map</a></small></p>

Answer 1

通常，当您想要在页面上并排排列某些内容时，您有两种选择：

旧学校方式 - 使用表格（如果您使用的是像Dreamweaver这样的程序，这应该相当容易 - 插入＆gt;表格）
更好的方法 - 使用CSS。这可能有点难以处理，因为你说你没有使用HTML的经验，我假设CSS。

CSS方式需要您创建一个包含两个分区（div）的样式表。以下是一些代码的示例：

<style>
 #col1{ width:300px; float:left;}
 #col2 { width:300px; float: right;}
</style>

上述代码将介于<head></head>个代码之间。然后在你的页面正文中，你只需要调用两个div：

<div id="col1">YOUR CONTENT</div>
<div id="col2">YOUR CONTENT</div>

Answer 2

我有类似的问题。我尝试使用CSS路由，但失败了。如果您使用的是Wordpress，最简单的方法是在要划分的部分中放置2列。然后在每个元素中放置一个元素，然后相应地定位其HTML代码。

在HTML中并排对齐元素

2 个答案: