如何让同一行上的三个DIV,从左到右排列呢,
我是这样写的,但不能排在同一行上,三个DIV是从上至下排列的效果。
<div align=left style= "border:0px solid green;width:20px;"></div>
<div align=center style= "border:0px solid green;width:800px;"></div>
<div align=right style= "width:150px;"></div>
[解决办法]
最好在外面也放一个div
<div style="width:875px"> <div align=left style= "border:0px solid green;width:20px;float:left;"> </div> <div align=center style= "border:0px solid green;width:800px;float:left;"> </div> <div align=right style= "width:150px;float:right;"> </div> </div
[解决办法]
最好在外面也放一个div
<div style="width:975px"> <div align=left style= "border:0px solid green;width:20px;float:left;"> </div> <div align=center style= "border:0px solid green;width:800px;float:left;"> </div> <div align=right style= "width:150px;float:right;"> </div> </div
[解决办法]
<div style="border:1px solid green;width:20px;float:left;background:red">a</div>
<div style="border:1px solid green;width:300px;float:left;background:green">def</div>
<div style="width:150px;background:blue;">ghgh</div>
强烈建议CSDN改掉这个随便插空格的愚蠢透顶的BUG
[解决办法]
[code=html]
[color=red] <div style="float:left">[/color]
<div style= "border:0px solid green;width:20px;[color=red]float:left[/color]"> </div>
<div style="border:0px solid green;width:800px;[color=red]float:right[/color]"> </div>
[color=red] </div>[/color]
<div style="width:150px;[color=red]float:right[/color]"> </div>
[/code]
[解决办法]
<div style="float:left;">12</div><div style="float:left;">12</div><div style="float:left;">12</div>
[解决办法]
[color=RED] <div style="float:left"> [/color] <div style= "border:0px solid green;width:20px;[color=RED]float:left[/color]"> </div> <div style="border:0px solid green;width:800px;[color=RED]float:right[/color]"> </div> [color=RED] </div> [/color] <div style="width:150px;[color=RED]float:right[/color]"> </div>
[解决办法]
建个一行三列的table 每列嵌个div
[解决办法]
<div style="float:left">
<div style= "border:1px solid green;">fdasfdaf</div>
<div style="border:1px solid green;"> fdafda</div>
<div style="border:1px solid green;"> fdsafdaf </div>
</div>
------解决方案--------------------
简单的方法放个TABLE在页面就行了
<table width="98%" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <div align=left style= "border:0px solid green;width:20px;"></div> </td> <td> <div align=center style= "border:0px solid green;width:800px;"> </div> </td> <td><div align=right style= "width:150px;"> </div> </td> </tr> </table>
[解决办法]
<style type="text/css">
div {float:left;}
</style>
<div style=border:1px solid #f00;">fuck ubb</div>
<div style=border:1px solid #0f0;">fuck ubb</div>
<div style=border:1px solid #00f;">fuck ubb</div>
[解决办法]
这个你只要定义个CSS样式就可以了啊
div {float:left;}
定义浮动!
[解决办法]
<html> <head> <title>CSS</title> </head> <style type="text/css" rel="stylesheet"> * { margin:0; padding:0; } #left { width:20%; float:left; clear:right; height:20px; background-color:yellow; } #mid{ width:60%; float:left; clear:right; height:60px; background-color:red; } #right{ width:20%; float:left; clear:right; height:20px; background-color:blue; } </style> <div id="left"></div> <div id="mid"></div> <div id="right"></div></html>
[解决办法]
把三个div的样式都加入float:left就可以了。这种方法同样可以实现li元素同一行显示。
[解决办法]
其实很容易的
由于div默认是block 块 会换行
span默认是inline 内联 同一行
所以你只要把没一个div的display设置成inline即可
<div align=left style="display:inline;border:1px solid green;width:20px;"></div><div align=center style="display:inline;border:1px solid green;width:800px;"></div><div align=right style="display:inline;border:1px solid green;width:150px;"></div>
[解决办法]
楼上的不错,