html中如何将两个div并列显示

<html><head><style>#e{margin-left:500px;margin-top:230px;font-style:italic;text-align... <html>

<head>

<style>

#e {
margin-left:500px;
margin-top:230px;
font-style:italic;
text-align:center;

}

</style>

</head>

<body background="lann.jpg">

<div id="e">

<div id="d" style="float:left">

<h2 class="tit" style="color:#000000">站点管理</h2>

<ul>
<li><h3><a href="" style="color:#000000">站点添加</a></h3></li>

<li><h3><a href="" style=" color:#000000 ">站点修改</a></h3></li>

<li><h3><a href="" style="color:#000000">站点删除</a></h3></li>
</ul>
</div>

<div id="c" style="float:right" >

<h2 class="tit2" style="color:#000000">线路管理</h2>

<ul>
<li><h3><a href="" style="color:#000000" >线路添加</a></h3></li>

<li><h3><a href="" style="color:#000000">线路修改</a></h3></li>

<li><h3><a href="" style="color:#000000">线路删除</a></h3></li><br/>

</li>
</ul>
<h2 class="tit2" style="color:#000000">关于</h2>

</div>
</div>

结果显示是这样，我想让站点管理和线路管理并列显示在“公交查询小助手”下面，这样看着好看，请问该如何实现，html也贴了出来，大家看看。展开

 我来答

5个回答

#热议# 为什么有人显老，有人显年轻？

回忆526
推荐于2017-09-07 · TA获得超过4165个赞

知道大有可为答主

回答量：3276

采纳率：87%

帮助的人：1896万

我也去答题访问个人页

关注

展开全部

并排的话，你需要使用CSS的float属性，然后在设置浮动；
比如
<div style="widht:500px">
<div style="float:left;width:200px">左</div>
<div style="float:left;width:200px">右</div>
</div>
这样，这个两个DIV标签就在同一行上了（同时靠左），当然有个前提，就是他们俩的父元素的宽度要至少大于400px，这样才能在同一行上。这个结果是两个DIV的右侧会空出100PX的空白
<div style="widht:500px">
<div style="float:left;width:200px">左</div>
<div style="float:right;width:200px">右</div>
</div>
以上写法，也是在同一行。不同的是，一个靠左，一个靠右。
这里边的两个DIV的中间有100PX的空白。

已赞过 已踩过<

评论收起

益阳资阳区有钱花信息科技

广告2024-12-19

专业pdf转换器下载，pdf在线转换器，pdf一键压缩，在线文档格式工具，支持word/ppt/excel等多种类型格式互转，无需下载在线pdf转换器，点击转换

pdfzhsq.wyyqh.cn

雨要诀
2013-08-15 · 超过18用户采纳过TA的回答

知道答主

回答量：54

采纳率：0%

帮助的人：39.4万

我也去答题访问个人页

关注

展开全部

把id为c的DIV设左浮动就OK了。（你设了右浮动。。。）这句应该这样写：<div id="c" style="float:left" >。

已赞过 已踩过<

评论收起

百度网友b9189da80
2013-08-15 · 超过11用户采纳过TA的回答

知道答主

回答量：54

采纳率：0%

帮助的人：35.6万

我也去答题访问个人页

关注

展开全部

直接设置2个div 左浮动就可以了。

更多追问追答

追问

的确是，能不能控制他们两个之间的距离，设置为左浮动之后距离太近了，请问可以不。

追答

当然可以的，只要你明白css中盒模型的原理就简单。
marging外部距离
padding内部距离

本回答被提问者采纳

已赞过 已踩过<

评论收起

好求知
2013-08-15 · TA获得超过6515个赞

知道大有可为答主

回答量：966

采纳率：80%

帮助的人：1173万

我也去答题访问个人页

关注

展开全部

①两个div style=float:left
②两个div style=display:inline-block;vertical-align:top（不一定兼容所有浏览器，获得像按钮一样的属性）

上面两个方法右边的div还要margin-left:**px或padding-left:**px，效果看看起来就不那么近了。

③绝对定位，不推荐。

还有，你把“关于”扩到右边的div里面了，感觉看起来有点不太好。

追问

谢谢，这点我也意识到了，正杂努力的改，谢谢了！但没该成功，改成如下，但距离还是如此。

已赞过 已踩过<

评论收起

方皖祎j9
2013-08-15 · TA获得超过2913个赞

知道小有建树答主

回答量：615

采纳率：50%

帮助的人：255万

我也去答题访问个人页

关注

展开全部

<html>

<head>

<style>

#e {
margin-left:500px;
margin-top:230px;
font-style:italic;
text-align:center;

}

</style>

</head>

<body background="lann.jpg">

<div id="e">

<div id="d" style="float:left">

<h2 class="tit" style="color:#000000">站点管理</h2>

<ul>
<li><h3><a href="" style="color:#000000">站点添加</a></h3></li>

<li><h3><a href="" style=" color:#000000 ">站点修改</a></h3></li>

<li><h3><a href="" style="color:#000000">站点删除</a></h3></li>
</ul>
</div>

<div id="c" style="float:left" >

<h2 class="tit2" style="color:#000000">线路管理</h2>

<ul>
<li><h3><a href="" style="color:#000000" >线路添加</a></h3></li>

<li><h3><a href="" style="color:#000000">线路修改</a></h3></li>

<li><h3><a href="" style="color:#000000">线路删除</a></h3></li><br/>

</li>
</ul>
<h2 class="tit2" style="color:#000000">关于</h2>

</div>
</div>