DIV、CSS-FLOAT應用( 網頁排版) - 專題

延續排版工作，使用到DIV、CSS(不想用Table)， ... 而之後的DIV自動也排「float:left;」， ... DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ... 專題搜尋這個協作平台 首頁CSSbackground:-webkit-gradient(背景漸層)border(邊框),margin(邊界),padding(邊距),....border-radius(圓角),linear-gradient(漸層),box-shadow(陰影)clear:both;(div層設置float)display:inline-block;強制水平排列不換行float:XXX(浮動排列)font-family(字體),字體設定[中文字型]text-align(內文本的水平對齊方式)圓角產生器CSS3animationfacebook按讚功能javascriptgetElementById的應用如何取得一個沒有ID的物件mysqlData-Typemysqlinstruction使用MySQL*.frm、*.MYD、*.MYI檔案批次輸入指令MySQLAdministrator管理你的MySQL資料庫mysqlerrorSQLException:Accessdeniedforuser'root'@''(usingpassword:YES)PHP訪客計數器tomcat6/conf/context.xml,server.xmlubuntusudo:cd:commandnotfound網頁方面CSS連結特效總整理DIV、CSS-FLOAT應用(網頁排版)fieldset(表單分組)frameset(框架式網頁)frameset+target(控制其他框架的網頁)HTML4.0語法教學html教程iframe(去框架)iframe語法-把外部網頁嵌入自己網頁的一種語法optgroup-在一個select中有多個selectoverflow-超出範圍的時候radio有submit的效果select-在一個頁面中有多個select(name用同一個)sessionsubmit指定快捷键Table語法框語法協作平台地圖 網頁方面‎>‎ DIV、CSS-FLOAT應用(網頁排版) http://www.dotblogs.com.tw/jain/archive/2010/03/04/13882.aspx延續排版工作，使用到DIV、CSS(不想用Table)，在設計DIV時，其中有一個設定「float:left;」，而之後的DIV自動也排「float:left;」，也就是說自動接在左側(冏rz)，解決方法很簡單，在之後加上「clear:both;」即可。<br><br> 不過，有討論到，若使用者的頁面寬度不同，在使用「float」時會造成排版上變動，於是將頁面限成5塊。<br><br>「Center」那塊DIV用左/右二邊的DIV包起來。<br><br>CSS:1#Left{2width:200px; float:left;}3 4#Right{5width:200px; float:right;}6 7#Content{8margin-left:200px;margin-right:200px;} -//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns>         <metahttp-equiv></metahttp-equiv>      <title>語法剖析</title>      <!--<linkhref="style.css"rel="stylesheet"type="text/css"/>-->      <styletype>         body{            font-family:Arial;            font-size:20px;            margin:0px;            line-height:150%;            text-align:center;            background-color:#CC6;         }         #container{            margin:0auto;            width:900px;            background-color:#FFF;         }         #header{            height:100px;            background:#F39;            margin-bottom:5px;            padding-top:20px;         }         #menu{height:40px;background:#FC0;margin-bottom:5px;}         #mainContent{overflow:auto;margin-bottom:5px;}         #sidebar{float:left;width:200px;background:#0F6;height:350px;padding-top:60px;}         #content{float:right;width:695px;height:350px;padding-top:60px;background:#cff;}         #footer{height:60px;background:#6cf;}                  <divid>         <divid>#Header         <divid>#Menu         <divid>            <divid>#Sidebar            <divid>#Content                  <divid>#Footer            </divid></divid></divid></divid></divid></divid></divid></styletype></htmlxmlns>

Comments Signin|RecentSiteActivity|ReportAbuse|PrintPage|PoweredByGoogleSites