zoukankan      html  css  js  c++  java
  • 学习DIV+CSS一个最简单的布局一行三列DIV代码!

    CSS代码如下:

     body{
      text-align:center;
      margin:0px;
      padding:0px;
     
      }
      #father
      {
      position:relative;
      750px;
      text-align:center;
      }
       #banner{height:96px;background-color:#999;text-align:left; padding:0px;margin:0px;}
       #b-left{159px;margin:0px;padding:0px;float:left;}
       #b-center{margin:0px;float:left;}
       #b-right{
       text-align:left;
       marign:0px;
       padding:0px;
       108px;
       background-color:#00ffff;
          height:96px;
       float:right;
    }
     HTML代码如下:

      <div id=banner>
        <div id=b-left> <img src="images/51.gif" /> </div>
        <div id=b-center><img  src="images/tupian26.gif" /></div>
        <div id=b-right>
          <ul style="list-style-type:none;">
            <br />
            <li>设为首页</li>
            <li>加入收藏</li>
            <li>联系我们</li>
          </ul>
        </div>
      </div>

    现在总结一下:

    一行三列的布局有以下几种 思想:

    第一都做成绝对的布局,设定每一个块和周围的距离

    第二就是利用嵌套的方法,把任意两个先当成一个,然后再把他们和第三个一起设!不过我这里好像直接把三个块都是分开设的,好像也没有问题!呵呵!

  • 相关阅读:
    随笔
    打破生活的套牢
    健忘是种美德
    【转贴】怎样冒充古典高手!
    php数组中删除元素
    JS 总结
    ubuntu apache rewrite
    JS 预览超级大图
    UBUNTU 安装SVN
    Yahoo14条前端优化规则
  • 原文地址:https://www.cnblogs.com/scgw/p/993934.html
Copyright © 2011-2022 走看看