3个回答
展开全部
三列横向并排列的几种代码示例：
1、
<style type="text/css">
/*<![CDATA[*/
div {
float:left;
margin:1px;
width:200px;
height:200px;
background:orange
}
/*]]>*/
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
</body>
2、
<style type="text/css">
/*<![CDATA[*/
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -300px;
}
/*]]>*/
</style>
</head>
<body>
<div style="background:#404040;width:200px;height:200px;">1</div>
<div style="background:#FD7C03;width:200px;height:200px;margin:-100px 0 0 -100px;">2</div>
<div style="background:#eee;width:200px;height:200px;margin:-100px 0 0 100px;">3</div>
</body>
</html>
3、
<style type="text/css">
/*<![CDATA[*/
span {
margin:1px;
display:-moz-inline-box;
display:inline-block;
width:300px;
height:200px;
background:orange;
}
/*]]>*/
</style>
</head>
<body>
<span></span>
<span></span>
<span></span>
</body>
</html>
1、
<style type="text/css">
/*<![CDATA[*/
div {
float:left;
margin:1px;
width:200px;
height:200px;
background:orange
}
/*]]>*/
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
</body>
2、
<style type="text/css">
/*<![CDATA[*/
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -300px;
}
/*]]>*/
</style>
</head>
<body>
<div style="background:#404040;width:200px;height:200px;">1</div>
<div style="background:#FD7C03;width:200px;height:200px;margin:-100px 0 0 -100px;">2</div>
<div style="background:#eee;width:200px;height:200px;margin:-100px 0 0 100px;">3</div>
</body>
</html>
3、
<style type="text/css">
/*<![CDATA[*/
span {
margin:1px;
display:-moz-inline-box;
display:inline-block;
width:300px;
height:200px;
background:orange;
}
/*]]>*/
</style>
</head>
<body>
<span></span>
<span></span>
<span></span>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
一个属性就可以搞定了.
先定义好三个块.例如.left,middle,right.然后里面是content.然后设置width.
最后设置
float:left;属性就可以.
先定义好三个块.例如.left,middle,right.然后里面是content.然后设置width.
最后设置
float:left;属性就可以.
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
css:
.main{width:800px;}
.lefts{float:left;width:250px;margin-right:10px;}
html:
<div class="main">
<div class="lefts">1列</div>
<div class="lefts">2列</div>
<div class="lefts">3列</div>
<div class="lefts">2行1列</div>
<div class="lefts">2行2列</div>
</div>
.main{width:800px;}
.lefts{float:left;width:250px;margin-right:10px;}
html:
<div class="main">
<div class="lefts">1列</div>
<div class="lefts">2列</div>
<div class="lefts">3列</div>
<div class="lefts">2行1列</div>
<div class="lefts">2行2列</div>
</div>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
