记录.NET学习的点滴,欢迎收藏我的博客

作者:路过秋天 http://cyq1162.cnblogs.com | www.mmic.net.cn欢迎大家交流,这里是我记录的空间方便以后工作查找
公告信息
记录.NET学习的点滴,欢迎收藏我的博客
文章分类
文章档案
文章
使用div+css中三列横向并排列的代码
2011/6/22 8:28:26
三列横向并排列的几种代码示例:
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>ADC08B3000CIYB
<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>
新浪微博粉丝精灵,刷粉丝、刷评论、刷转发、企业商家微博营销必备工具"
 MyQBlog   浏览(1464)   评论(0)   关键字
  
Copyright © 2010-2020 power by CYQ.Blog - 秋色园 v2.0 All Rights Reserved