1、流動(dòng)布局流動(dòng)布局是瀏覽器默認(rèn)的布局方式他會(huì)按照你所寫的標(biāo)簽特性，從上至下從左到右的方式進(jìn)行排列在HTML中我們按照標(biāo)簽的排列特性可以將它們分成三類1行級(jí)元素不獨(dú)占一行，不能設(shè)置元素的高度寬度和底邊邊距；HTML5新元素及其特性HTML5的語(yǔ)義化標(biāo)簽以及屬性，可以讓開發(fā)者非常方便地實(shí)現(xiàn)清晰的web頁(yè)面布局，加上CSS3的效果渲染，快速建立豐富靈活的web頁(yè)面顯得非常簡(jiǎn)單本次學(xué)習(xí)HTML5的新標(biāo)簽元素有l(wèi)theader定義頁(yè)面或區(qū)段的頭部ltfooter定義頁(yè)面；1HTML布局主要有兩種方式，一種是表格布局，一種是DIV布局2HTML表格布局是WEB10時(shí)代主要使用的布局方式，即使用TABLE標(biāo)簽進(jìn)行布局，優(yōu)點(diǎn)是布局比較簡(jiǎn)單3HTML DIV布局是WEB20時(shí)代主要使用的布局方式，優(yōu)點(diǎn)是符合；1圖片寬高固定，這種情況很簡(jiǎn)單水平居中就在圖片的css中加dispalyblockmargin0auto垂直居中自己算出p的高度圖片的高度2，得到margintop值即可2圖片高度未知，這個(gè)布局比較難實(shí)現(xiàn)一般我是用js做的。

2、1如果你會(huì)htmlcss可以直接寫代碼，最方便的是用網(wǎng)上的js插件，有很多很炫酷的插件2如果不了解代碼的話就用ps做出整個(gè)網(wǎng)頁(yè)頁(yè)面，然后將每個(gè)按鈕每個(gè)菜單欄每個(gè)你要修改的地方都拆成一個(gè)個(gè)小圖片，最后在；可以使用多種布局方法1 使用rem單位，窗口改變時(shí)，js修改頂層像素尺寸2 js整體縮放窗口，動(dòng)態(tài)改變transform的scale值3 使用css媒體查詢，動(dòng)態(tài)更改字體大小，配合gridtable或flex布局4 js動(dòng)態(tài)更改meta的設(shè)備縮放；3無(wú)論什么元素，一旦設(shè)置為是浮動(dòng)顯示，就擁有了完整的盒模型結(jié)構(gòu)，我們就可以使用外邊距，內(nèi)邊距，邊框，高和寬來(lái)控制的大小以及與其他對(duì)象之間的位置關(guān)系4浮動(dòng)是從網(wǎng)頁(yè)布局的角度來(lái)定義元素的顯示，而行內(nèi)和塊狀屬性。

3、第一步新建html文檔并搭建框架 新建一個(gè)TXT文檔，重命名為“田子格布局html”，然后用記事本打開，輸入表頭信息，已經(jīng)html整體框架搭建包括head與body第二步DIV布局 分別復(fù)制4個(gè)不同的div作為4部分，并且分別命名為；首先說(shuō)下移動(dòng)端的布局rem布局rem是指html元素上的字體大小對(duì)應(yīng)的像素?cái)?shù)值，使用rem為長(zhǎng)度單位理想情況下如果將所有的長(zhǎng)度單位都用rem標(biāo)示，那么我只需要更改html上的fontsize即可同步按比例更改所有長(zhǎng)度單位包括。

4、6“三”型布局 這種布局多用于國(guó)外網(wǎng)站，國(guó)內(nèi)用得不多其特點(diǎn)是頁(yè)面上橫向兩條色塊，將頁(yè)面整體分割為4個(gè)部分，色塊中大多放廣告條7對(duì)稱對(duì)比布局 顧名思義，它指采取左右或者上下對(duì)稱的布局，一半深色，一半淺色；在HTML開發(fā)中，制作網(wǎng)站時(shí)首先需要考慮內(nèi)容是頁(yè)面內(nèi)容和頁(yè)面布局首頁(yè)是整個(gè)網(wǎng)站頁(yè)面最完整的內(nèi)容，將網(wǎng)站的每一欄內(nèi)容設(shè)置為一個(gè)，這樣的功能如果排版不當(dāng)，那么首頁(yè)就會(huì)出現(xiàn)混亂因此，主頁(yè)的布局是整個(gè)網(wǎng)站的首要任務(wù)，所以主頁(yè)的布局必須簡(jiǎn)；利用HTML進(jìn)行布局的方法有1通過(guò)“l(fā)ttable”標(biāo)簽來(lái)對(duì)表格的行和列進(jìn)行排列來(lái)實(shí)現(xiàn)頁(yè)面布局的效果2將網(wǎng)頁(yè)內(nèi)容放在多個(gè)頁(yè)面中的多列布局3使用div和span標(biāo)簽進(jìn)行布局頁(yè)面布局標(biāo)題前端的一部分，用于頁(yè)面頂部lt；1所謂HTML是超文本標(biāo)記語(yǔ)言HyperText Markup Language，簡(jiǎn)稱HTML是一種用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)準(zhǔn)標(biāo)記語(yǔ)言2HTML頁(yè)面布局有兩種方式，一種是TABLE布局，一種是DIV布局3以前WEB10時(shí)代基本上都是table布局，后來(lái)WEB20；1浮動(dòng)布局技術(shù)，兼容性比較，但頁(yè)面寬度不夠時(shí)會(huì)影響布局2絕對(duì)定位布局技術(shù)3flex彈性布局技術(shù)，自適應(yīng)好，高度能自動(dòng)撐開。

5、0quot lttitleDocumentlttitle ltstyle * margin 0 padding 0 html， body height 100% body display flex flexdirection column。