0731-55587844
其他(360、58、霸屏、搜狗、小程序)等代理合作请发邮箱254596208@qq.com
站内公告:  如果您有其它业务联系,请发邮件至yaner@y1web.com邮箱,谢谢您的配合!
营销型网站建设第一品牌——优度网络
现在的位置:首页 > 发布营销型网站建设 > 新闻资讯 > css布局定位 双栏框架
css布局定位 双栏框架
信息来源:优度网络  发布日期:2009/3/29 浏览数量:984
文章导读:

实例作品

<html>
<head>
<style type="text/css">
<!--
body {
 margin:0px;
 font-size:13px;
 font-family:Arial;
}
#container{
 position:relative;
 width:100%;
}
#banner{
 height:80px;
 border:1px solid #000000;
 text-align:center;
 background-color:#a2d9ff;
 padding:10px;
 margin-bottom:2px;
}
#content{
 float:left;
 text-align:center;
 padding-right:200px; /* 内容往回挤200px */
}
#links{
 float:right;
 width:200px;
 border:1px solid #000000;
 margin-left:-200px;  /* 强行往左拉回200px */
 text-align:center;
}
#footer{
 clear:both;    /* 不受float影响 */
 text-align:center;
 height:30px;
 border:1px solid #000000;
}
-->
</style>
<title>CSS排版</title><body>
<div id="container">
 <div id="banner">banner</div>
 <div id="links">
  <div class="calendarhead">links<br>links<br>links<br>links</div>
  <div class="calendartable">links<br>links<br>links<br>links</div>
  <div class="side">links<br>links<br>links<br>links</div>
  <div class="syndicate">links<br>links<br>links<br>links</div>
  <div class="friends">links<br>links<br>links<br>links</div>
 </div>
 <div id="footer">footer</div>
</div>
</body>
</html>

相关信息
  • 网络营销培训
  • 微网站
  • 扫二维码
  • 1
  • 2
  • 3
  • 最新上传
  • 精品案例
  • 自动流水线嘉
  • 湖南省湘江重
  • 湘潭家居\建
  • 湘潭学校微网
0731-55587844
传真:0731-55587844
邮箱:254596208@qq.com
地址:湖南省湘潭市岳塘区霞光东路58号(维也纳酒店6楼)
优度官方微信扫一扫关注官方微信

关注优度

官方微信
官方微博
官网首页