sclsch

          java備忘

          BlogJava 首頁 新隨筆 聯(lián)系 聚合 管理
            10 Posts :: 0 Stories :: 6 Comments :: 0 Trackbacks
          我是css初學(xué)者,自己做了一個工字型的布局,但整個頁面不居中。請指點,代碼如下:
          <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
          <HTML>
           
          <HEAD>
            
          <style type="text/css">

                * 
          {
              margin
          : 0px;
              padding
          : 0px;
              
          }
               body 
          {
              font-family
          : Arial, Helvetica, sans-serif;
              font-size
          : 12px;
              margin
          : 0px auto;
              height
          : auto;
              width
          : 760px;
              border
          :1px #66CCFF solid;
             
              
          }
              .header 
          {
              height
          : 100px;
              width
          : 760px;
              background-image
          : url(header.jpg);
              background-repeat
          : no-repeat;
              margin
          :0px 0px 3px 0px;
              border
          :1px #66CCFF solid;
               
              
          }

              .contentleft 
          {
              height
          : 250px;
              width
          : 150px;
              font-size
          : 14px;
              list-style-type
          : none;
              float
          :left;
              border
          :1px #66CCFF solid;

              
          }
              .contentleft li 
          {
              float
          :left;
              
          }
              .contentleft li a
          {
              color
          :#000000;
              text-decoration
          :none;
              padding-top
          :4px;
              display
          :block;
              width
          :97px;
              height
          :22px;
              text-align
          :center;
              background-color
          : #009966;
              margin-left
          :2px;
              
          }
              .contentleft li a:hover
          {
              border
          :1px #66CCFF solid;
              color
          :#FFFFFF;
              
          }
              .content 
          {
              height
          :auto;
              width
          : 760px;
              line-height
          : 1.5em;
              padding
          : 10px;
              border
          :1px #66CCFF solid;
              
          }
              .content p 
          {
              text-indent
          : 2em;
              
          }
              .content h3 
          {
              font-size
          : 16px;
              margin
          : 10px;
              
          }

              .footer 
          {
              height
          : 50px;
              width
          : 760px;
              line-height
          : 2em;
              text-align
          : center;
              background-color
          : #009966;
              padding
          : 10px;
              border
          :1px #66CCFF solid;
              
          }
              .contentright
          {
                  height
          : 250px;
                  width
          : 580px;
                  font-size
          : 14px;
                  list-style-type
          : none;
                  border
          :1px #66CCFF solid;
                  float
          :right;
              
          }
              .logo
          {
                background-image
          : url(scltemp.jpg);
                height
          : 100px;
                width
          : 75px;

              
          }

            
          </style>
             
            
          <TITLE> New Document </TITLE>
            
          <META NAME="Generator" CONTENT="EditPlus">
            
          <META NAME="Author" CONTENT="">
            
          <META NAME="Keywords" CONTENT="">
            
          <META NAME="Description" CONTENT="">
           
          </HEAD>

           
          <BODY>
          <div class="header">
            
          <div class="logo"></div>
          </div>

          <div class="content">
              
          <div class="contentleft">
              
          <li><href="#">首 頁</a></li>
              
          <li><href="#">文 章</a></li>
              
          <li><href="#">相冊</a></li>
              
          <li><href="#">Blog</a></li>
              
          <li><href="#">論 壇</a></li>
              
          <li><href="#">幫助</a></li>
              
          </div>
              
          <div class="contentright">
              
          <h3>前言</h3>
              
          <p>第一段內(nèi)容</p>
              
          <h3>理解CSS盒子模式</h3>
              
          <p>第二段內(nèi)容</p>
              
          </div>
          </div>

          <div class="footer">
          <p>關(guān)于華升 | 廣告服務(wù) | 華升招聘 | 客服中心 | Q Q留言 | 網(wǎng)站管理 | 會員登錄 | 購物車</p><p>Copyright &copy;2006 - 2008 Tang
          Guohui. All Rights Reserved
          </p>
          </div>
           
          </BODY>
          </HTML>
          另外,還有很多不完美的地方,請指點一下!

          posted on 2008-10-05 21:00 sclsch 閱讀(753) 評論(3)  編輯  收藏

          Feedback

          # re: 如何控制css居中? 2008-10-06 13:22 楊愛友
          在樣式表body里加上個text-align:center;就劇中啦。你的樣式表代碼都沒有縮進,看起來很別扭。  回復(fù)  更多評論
            

          # re: 如何控制css居中? 2008-10-07 16:06 nicg
          text-align:center;這個就是區(qū)域范圍內(nèi)的劇中操作,如果你想讓什么劇中,就在它的容器中加入如下屬性即可  回復(fù)  更多評論
            

          # re: 如何控制css居中? 2008-10-27 19:42 sclsch
          謝謝。  回復(fù)  更多評論
            


          只有注冊用戶登錄后才能發(fā)表評論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 溧水县| 东安县| 海口市| 玉门市| 平顶山市| 顺昌县| 大竹县| 即墨市| 金山区| 桐柏县| 准格尔旗| 丽水市| 唐海县| 梓潼县| 胶州市| 拜城县| 禹州市| 阳曲县| 建阳市| 子洲县| 绥滨县| 深圳市| 新源县| 四子王旗| 南乐县| 会理县| 奇台县| 微博| 海门市| 资阳市| 延川县| 海口市| 虞城县| 柘荣县| 阿荣旗| 拉萨市| 茶陵县| 舒城县| 石林| 桑植县| 大石桥市|