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 閱讀(757) 評論(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)航:
           
          主站蜘蛛池模板: 惠州市| 昌乐县| 彝良县| 南开区| 平山县| 布尔津县| 邵阳市| 奉贤区| 尉犁县| 乌苏市| 江门市| 准格尔旗| 藁城市| 仙居县| 台湾省| 德化县| 江油市| 丹巴县| 房产| 甘南县| 龙口市| 舞钢市| 望城县| 韶山市| 如皋市| 黑山县| 乐安县| 沁水县| 哈密市| 温宿县| 师宗县| 阳新县| 涡阳县| 游戏| 哈巴河县| 将乐县| 石渠县| 宣武区| 牡丹江市| 万山特区| 耒阳市|