⑴ html要怎麼布局

這個的話很空泛，你想要怎麼布局就怎麼布局。
但是一般的結構就是上中下。
對應header conteng footer 這三部分，中間的部分可以根據自己的需要劃分，可以是左右，右左，左中右，上下，下上，上中下等等。

⑵ 誰有網頁設計與布局項目化教程（HTML+CSS+DIV）裡面5、6章案例的源碼

在局部的教程中，第五章和第六章的案例你可以忽略不計

⑶ 如何用html,css,div實現網頁布局

拿去用<!DOCTYPEhtml>
<html>

<head>
<metacharset="utf-8">
<title>div</title>
</head>

<body>

<divid="container"style="width:500px">

<divid="header"style="background-color:#FFA500;">
<h1style="margin-bottom:0;">主要的網頁標題</h1></div>

<divid="content"style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
內容在這里</div>

<divstyle="height:100px;width:100px;float:right;">
<divid="menu"style="background-color:#456900;height:100px;width:100px;position:relative;">
側邊</div>

<divid="footer"style="background-color:#FFA500;height:100px;width:100px;position:relative;">
版權</div>

</div>

</div>

</body>

⑷ HTML如何排版

  1. 現在pc端主流的技術是css+div布局。

  2. 移動端是html5+css3+js布局。

布局其實就是用html標簽嵌套加上css加以回控制樣式答，javascript腳本實現高級的動作。

文字一般使用閉合的標簽p、span、a、li等閉合標簽進行嵌套。

例如：

<a href='#'>放入的文字</a>

<p>放入的文字</p>

⑸ html 怎麼用div 來布局。。

div 布局，首先熟悉CSS樣式表。

其實挺容易的。
相對表格而言，顯示速度更快。調整也很方便。
可以下載教程看看。
只要通過一個實例演示或者操作，基本就可以掌握。
祝你成功！

⑹ html 的常用布局塊級標簽 求教程啊！

去電驢搜索李炎恢，李炎恢老師有講html，講的很詳細，我看完了，感覺灰常的不錯，你可以去看看，希望可以幫到你。

⑺ HTML+CSS+JavaScript網頁設計與布局實用教程電子版

其實這個不是很難，不要CVC光碟也行。主要多看，多想，多練。把書上的案例自己多敲敲，當你看到效果時你的激情就會來了。我是自學這些都學過，真的不難。學這些方面的知識需要耐心和悟性。加油！祝你學有所成！

⑻ 製作HTML怎樣用布局

一般來說 用DIV+CSS來布局，也就是層和樣式。 css 說白了就是網頁的衣服！
比如說背景顏色，字體屬性，這一類的！
div是一個標簽！
要把css 這件衣服嵌套在div標簽中，從而讓代碼變的簡單！
並且美觀！<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns=" http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css8</title>
<style type="text/css">
<!--
body {
margin:0;
font-size:12px;
}
#main{
width:780px;
margin:0 auto;
background:#f00;
height:800px;
}
#hader,#nav,#content,#footer{
width:100%
}
#hader
{
height:150px
}
#nav{
height:30px
}
#content{
height:570px
}
#footer{
height:50px
}
-->
</style>
</head>

<body>
<div id="main">
<div id="hader"></div>
<div id="nav"></div>
<div id="content"></div>
<div id="footer"></div>
</div>
</body>
</html>
上面的代碼是 找來的 也是DIV+CSS 布局的 以上答案供參考

⑼ HTML+CSS網頁設計與布局從入門到精通的目錄

第1部分HTML基礎篇
第1章網頁設計基礎知識3
1.1基礎概念
1.2網頁與HTML語言4
1.3Web標准：結構、表現與行為5
1.3.1標準的重要性5
1.3.2「Web標准」概述6
1.4初步理解網頁設計與開發的過程7
1.4.1基本任務與角色7
1.4.2明確網站定位8
1.4.3收集信息和素材8
1.4.4策劃欄目內容8
1.4.5設計頁面方案9
1.4.6製作頁面9
1.4.7實現後台功能9
1.4.8整合與測試網站10
1.5與設計相關的技術因素10
1.6本章小結12
第2章HTML網頁文檔結構13
2.1HTML簡介13
2.1.1創建第一個HTML文件13
2.1.2HTML文件結構15
2.2簡單的HTML案例16
2.3網頁源文件的獲取18
2.3.1直接查看源文件19
2.3.2保存網頁19
2.4輔助：利用Dreamweaver快速建立基本文檔20
2.5本章小結24
第3章用HTML設置文本和圖像25
3.1文本排版25
3.1.1實現段落與段內換行(p和br)25
3.1.2設置標題(h1～h6)27
3.1.3使文字水平居中(center)27
3.1.4設置文欄位落的縮進(blockquote)29
3.2設置文字列表29
3.2.1建立無序列表(ul)29
3.2.2建立有序列表(ol)30
3.3HTML標記與HTML屬性31
3.3.1用align屬性控制段落的水平位置31
3.3.2用bgcolor屬性設置背景顏色32
3.3.3設置文字的特殊樣式34
3.3.4設置文字的大小和顏色(font)35
3.4忘記過時的HTML標記和屬性35
3.5特殊文字元號36
3.6在網頁中使用圖像(img)38
3.6.1網頁中的圖片格式38
3.6.2一個簡單的圖片網頁38
3.6.3使用路徑39
3.7用width和height屬性設置圖片的尺寸41
3.8用alt屬性為圖像設置替換文本43
3.9輔助：利用Dreamweaver設置文本和圖像43
3.10輔助：利用Dreamweaver代碼視圖提高效率47
3.10.1代碼提示47
3.10.2代碼折疊49
3.10.3使用拆分視圖對代碼快速定位49
3.11本章小結50
第4章用HTML建立超鏈接(a)51
4.1設置基本文字超鏈接51
4.1.1URL的格式51
4.1.2URL的類型52
4.2設置頁面內部的特定目標的鏈接53
4.3設置圖片的超鏈接54
4.4設置電子郵件鏈接54
4.5設置以新窗口顯示鏈接頁面55
4.6創建熱點區域55
4.6.1用HTML建立熱點區域(map和area)56
4.6.2輔助：利用Dreamweaver精確定位熱點區域57
4.7框架之間的鏈接59
4.7.1建立框架與框架集(frame和frameset)59
4.7.2用cols屬性將窗口分為左右兩部分60
4.7.3用rows屬性將窗口分為上中下三部分60
4.7.4框架的嵌套61
4.7.5用src屬性在框架中插入網頁61
4.7.6用src屬性在框架之間鏈接62
4.7.7創建嵌入式框架(iframe)64
4.8鏈接增多後網站的組織結構與維護65
4.9本章小結66
第5章用HTML創建表格67
5.1表格基本結構(table)67
5.2合並單元格68
5.2.1用colspan屬性左右合並單元格68
5.2.2用rowspan屬性上下合並單元格69
5.3用align屬性設置對齊方式70
5.4用bgcolor屬性設置表格背景色和邊框顏色71
5.5用cellpadding屬性和cellspacing屬性設定距離72
5.6完整的表格標記(thead、tbody和tfoot)73
5.7需要拋棄的方法：用表格進行頁面布局75
5.8本章小結78
第2部分CSS基礎篇
第6章(X)HTML與CSS概述81
6.1HTML與XHTML81
6.1.1追根溯源81
6.1.2DOCTYPE(文檔類型)的含義與選擇82
6.1.3XHTML與HTML的重要區別83
6.2(X)HTML與CSS84
6.2.1CSS標准85
6.2.2傳統HTML的缺點85
6.2.3CSS的引入86
6.2.4如何編輯CSS88
6.2.5瀏覽器與CSS89
6.3本章小結90
第7章CSS核心基礎91
7.1構造CSS規則91
7.2基本CSS選擇器92
7.2.1標記選擇器92
7.2.2類別選擇器93
7.2.3ID選擇器95
7.3在HTML中使用CSS的方法96
7.3.1行內樣式96
7.3.2內嵌式97
7.3.3鏈接式98
7.3.4導入樣式99
7.3.5各種方式的優先順序問題100
7.4本章小結102
第8章手工編寫與藉助工具103
8.1從零開始103
8.2設置標題104
8.3控制圖片105
8.4設置正文106
8.5設置整體頁面106
8.6對段落進行分別設置107
8.7完整代碼108
8.8CSS的注釋109
8.9輔助：使用Dreamweaver創建頁面109
8.10輔助：在Dreamweaver中新建CSS規則110
8.11輔助：在Dreamweaver中編輯CSS規則112
8.12為圖像創建CSS規則114
8.13本章小結116
第9章CSS的高級特性117
9.1復合選擇器117
9.1.1「交集」選擇器117
9.1.2「並集」選擇器118
9.1.3後代選擇器120
9.2CSS的繼承特性122
9.2.1繼承關系122
9.2.2CSS繼承的運用123
9.3CSS的層疊特性125
9.4本章小結126
第10章用CSS設置文本樣式127
10.1長度單位127
10.2顏色定義128
10.3准備頁面129
10.4設置文字的字體129
10.5設置文字的傾斜效果130
10.6設置文字的加粗效果131
10.7英文字母大小寫轉換132
10.8控制文字的大小133
10.9文字的裝飾效果133
10.10設置段落首行縮進134
10.11設置字詞間距135
10.12設置段落內部的文字行高136
10.13設置段落之間的距離136
10.14控制文本的水平位置137
10.15設置文字與背景的顏色138
10.16設置段落的垂直對齊方式138
10.16.1使用line-height屬性進行設置138
10.16.2更通用的解決方案139
10.17本章小結140
第11章用CSS設置圖像效果141
11.1設置圖片邊框141
11.1.1基本屬性141
11.1.2為不同的邊框分別設置樣式142
11.2圖片縮放144
11.3圖文混排145
11.3.1文字環繞145
11.3.2設置圖片與文字的間距146
11.4案例——八大行星科普網頁147
11.5設置圖片與文字的對齊方式150
11.5.1橫向對齊方式150
11.5.2縱向對齊方式151
11.6本章小結154
第12章用CSS設置背景顏色與圖像155
12.1設置背景顏色155
12.2設置背景圖像156
12.3設置背景圖像平鋪157
12.4設置背景圖像位置159
12.5設置背景圖片位置固定162
12.6設置標題的圖像替換163
12.7使用滑動門技術的標題166
12.8本章小結168
第3部分CSS高級篇
第13章CSS盒子模型171
13.1「盒子」與「模型」的概念探究171
13.2邊框(border)172
13.2.1設置邊框樣式(border-style)173
13.2.2屬性值的簡寫形式174
13.2.3邊框與背景176
13.3設置內邊距(padding)177
13.4設置外邊距(margin)178
13.5盒子之間的關系179
13.5.1HTML與DOM180
13.5.2標准文檔流183
13.5.3div標記與span標記184
13.6盒子在標准流中的定位原則187
13.6.1行內元素之間的水平margin187
13.6.2塊級元素之間的豎直margin188
13.6.3嵌套盒子之間的margin189
13.6.4margin屬性可以設置為負值191
13.7思考題192
13.8本章小結196
第14章盒子的浮動與定位197
14.1盒子的浮動197
14.1.1准備代碼197
14.1.2案例1——設置第1個浮動的div199
14.1.3案例2——設置第2個浮動的div199
14.1.4案例3——設置第3個浮動的div199
14.1.5案例4——改變浮動的方向200
14.1.6案例5——再次改變浮動的方向200
14.1.7案例6——全部向左浮動201
14.1.8案例7——使用clear屬性清除浮動的影響202
14.1.9案例8——擴展盒子的高度203
14.2盒子的定位204
14.2.1靜態定位(static)204
14.2.2相對定位(relative)205
14.2.3絕對定位(absolute)209
14.2.4固定定位(fixed)214
14.3z-index空間位置214
14.4盒子的display屬性215
14.5本章小結216
第15章用CSS設置表格樣式217
15.1控製表格217
15.1.1表格中的標記217
15.1.2設置表格的邊框219
15.1.3確定表格的寬度222
15.1.4其他與表格相關的標記223
15.2美化表格224
15.2.1搭建HTML結構224
15.2.2整體設置225
15.2.3設置單元格樣式226
15.2.4斑馬紋效果227
15.2.5設置列樣式227
15.3設置滑鼠指針經過時整行變色提示的表格232
15.3.1在Firefox和IE 7中實現滑鼠指針經過時整行變色232
15.3.2在IE 6中實現滑鼠指針經過時整行變色233
15.3.3最終合並代碼234
15.4輔助：使用jQuery實現更多效果236
15.4.1用jQuery實現斑馬紋效果237
15.4.2用jQuery實現「前3行」特殊樣式239
15.4.3用jQuery實現漸變背景色表格效果240
15.4.4用jQuery實現滑鼠指針經過變色效果241
15.5案例——日歷241
15.5.1搭建HTML結構241
15.5.2設置整體樣式和表頭樣式244
15.5.3設置日歷單元格樣式245
15.6本章小結248
第16章用CSS設置鏈接與導航菜單249
16.1豐富的超鏈接特效250
16.2創建按鈕式超鏈接252
16.3製作熒光燈效果的菜單253
16.3.1HTML框架254
16.3.2設置容器的CSS樣式254
16.3.3設置菜單項的CSS樣式255
16.4控制滑鼠指針257
16.5設置項目列表樣式257
16.5.1列表的符號258
16.5.2圖片符號260
16.6創建簡單的導航菜單261
16.6.1簡單的豎直排列菜單261
16.6.2橫豎自由轉換菜單264
16.7設置圖片翻轉效果265
16.8應用滑動門技術的玻璃效果菜單266
16.8.1基本思路266
16.8.2設置菜單整體效果267
16.8.3使用「滑動門」技術設置玻璃材質背景268
16.8.4進一步解決的問題269
16.9滑鼠指針經過時給圖片增加邊框270
16.10本章小結272
第17章用CSS建立表單273
17.1表單的用途和原理273
17.2表單輸入類型274
17.2.1文本輸入框274
17.2.2單選按鈕274
17.2.3復選按鈕275
17.2.4密碼輸入框275
17.2.5按鈕276
17.2.6多行文本框277
17.2.7列表框277
17.3CSS與表單278
17.3.1表單中的元素278
17.3.2像文字一樣的按鈕281
17.3.3多彩的下拉菜單283
17.4案例——「數獨」游戲網頁284
17.4.1搭建基本表格285
17.4.2設置表格樣式286
17.4.3加入文本輸入框287
17.4.4設置文本輸入框的樣式287
17.5對齊文本框和旁邊的圖像按鈕289
17.6本章小結290
第18章網頁樣式綜合案例——靈活的電子相冊291
18.1搭建框架291
18.2陣列模式293
18.3單列模式298
18.4改進陣列模式301
18.5IE 6兼容304
18.6雙向聯動模式306
18.6.1在Firefox中實現306
18.6.2IE 6兼容311
18.6.3改變方向312
18.7本章小結314
第4部分CSS布局篇
第19章固定寬度布局剖析與製作317
19.1向報紙學習排版思想317
19.2CSS排版觀念319
19.2.1兩列布局320
19.2.2三列布局320
19.2.3多列布局321
19.2.4布局結構的表達式與結構圖321
19.3圓角框325
19.3.1准備圖像325
19.3.2搭建HTML結構326
19.3.3放置背景圖像328
19.3.4設置樣式並修復缺口329
19.4單列布局330
19.4.1放置第一個圓角框331
19.4.2設置圓角框的CSS樣式331
19.4.3放置其他圓角框334
19.5「1-2-1」固定寬度布局335
19.5.1准備工作336
19.5.2絕對定位法337
19.5.3浮動法339
19.6「1-3-1」固定寬度布局341
19.7「1-((1-2)+1)-1」固定寬度布局343
19.8本章小結344
第20章變寬度網頁布局剖析與製作345
20.1「1-2-1」變寬度網頁布局345
20.1.1「1-2-1」等比例變寬布局345
20.1.2「1-2-1」單列變寬布局348
20.2「1-3-1」寬度適應布局352
20.2.1「1-3-1」三列寬度等比例布局352
20.2.2「1-3-1」單側列寬度固定的變寬布局352
20.2.3「1-3-1」中間列寬度固定的變寬布局353
20.2.4進一步的思考355
20.2.5「1-3-1」雙側列寬度固定的變寬布局356
20.2.6「1-3-1」中列和側列寬度固定的變寬布局358
20.3變寬布局方法總結359
20.4分列布局背景色問題360
20.4.1設置固定寬度布局的列背景色360
20.4.2設置特殊寬度變化布局的列背景色364
20.4.3設置單列寬度變化布局的列背景色364
20.5CSS排版與傳統的表格方式排版的分析365
20.6瀏覽器的兼容性問題368
20.7CSS布局頁面的調試技巧368
20.7.1技巧1：設置背景色或者邊框，確定錯誤范圍369
20.7.2技巧2：刪除無關代碼，暴露核心矛盾369
20.7.3技巧3：先用Firefox調試，然後使它兼容IE369
20.7.4技巧4：善於利用工具，提高調試效率370
20.7.5技巧5：善於提問，尋求幫助370
20.8本章小結370
第21章網頁布局綜合案例——兒童用品網上商店371
21.1案例概述371
21.2內容分析372
21.3HTML結構設計374
21.4原型設計377
21.5頁面方案設計380
21.6布局設計383
21.6.1整體樣式設計383
21.6.2頁頭部分384
21.6.3內容部分386
21.6.4頁腳部分389
21.7細節設計389
21.7.1頁頭部分389
21.7.2內容部分395
21.7.3左側的主要內容列395
21.7.4右邊欄398
21.8CSS布局的優點402
21.9交互效果設計403
21.9.1次導航欄403
21.9.2主導航欄404
21.9.3賬號區404
21.9.4圖像邊框405
21.9.5產品分類407
21.10遵從Web標準的設計流程407
21.11從「網頁」到「網站」408
21.11.1歷史回顧408
21.11.2不完善的辦法408
21.11.3伺服器出場409
21.11.4CMS出現409
21.11.5具體操作409
21.12 本章小結410
附錄A網站發布與管理411
A.1在Internet上建立自己的Web站點411
A.1.1製作網站內容411
A.1.2申請域名411
A.1.3信息發布411
A.2租用虛擬主機空間412
A.2.1了解基本的技術名詞412
A.2.2選擇和租用虛擬主機413
A.3向伺服器上傳網站內容414
A.3.1使用Dreamweaver上傳文件414
A.3.2使用IE瀏覽器上傳文件415
A.3.3使用專業FTP工具上傳文件416
A.4網站管理418
A.4.1修改密碼418
A.4.2集團郵箱管理419
A.4.3注意事項420
附錄BCSS英文小字典421

⑽ html中用div完成田字格的布局怎麼弄

這個比較簡單，可以拆分一下，先上下布局，在子區域里左右布局。
<div>
<div style="float:left;width:49%">上左</div>
<div style="float:rightwidth:49%">上右</div>
</div>
<div>
<div style="float:left;width:49%">下左</div>
<div style="float:rightwidth:49%">下右</div>
</div>
具體css自行設置
當然，先左右布局，在子區域里上下布局也行