1、CSSCSS與與DIVDIV查閱可以查閱css的詳細(xì)規(guī)格闡明一、標(biāo)志與標(biāo)志1、概述 10-1.html對于單塊來說和沒有什么區(qū)別，標(biāo)志是專門針對款式表設(shè)計的標(biāo)志division是一個區(qū)塊容器標(biāo)志也是一個容器標(biāo)志都是獨立出各自的區(qū)塊2、與的區(qū)別 10-2.html是一個塊級元素block-level，他包圍的元素會自動換行是一個行內(nèi)元素line elements，在他的后面不會換行，沒有構(gòu)造上的意義，純粹是運用款式，當(dāng)其他行內(nèi)元素都不適宜的時候就可以運用span元素可以包含于標(biāo)志中，成為他的子元素，而反過來那么不成立，即標(biāo)志不能包含標(biāo)志3、閱歷：在頁面中大的區(qū)塊運用div標(biāo)志，spa

2、n標(biāo)志適用于需求獨立設(shè)置風(fēng)格的小元素，比如一個單詞，一副圖片和一個超鏈接等。塊級元素block-level，塊狀標(biāo)簽div標(biāo)簽ol、ul、li標(biāo)簽dl、dt、dd標(biāo)簽p標(biāo)簽table、tr、th、td標(biāo)簽h1、h2、h3、h4、h5、h6標(biāo)簽行內(nèi)元素line elements，內(nèi)聯(lián)標(biāo)簽a標(biāo)簽br標(biāo)簽img標(biāo)簽span標(biāo)簽二、盒子模型 1、盒子模型的概念 是DIV排版的中心所在，傳統(tǒng)的表格排版是經(jīng)過大小不一的表格和表格嵌套來定位排版網(wǎng)頁內(nèi)容，改用CSS排版后，就是經(jīng)過由CSS定義的大小不一的盒子和盒子嵌套來編排網(wǎng)頁。 一個盒模型由內(nèi)容(content)、填充(padding)、邊框(border

3、)、邊境(margin)，這四部分組成整個盒模型在頁面中所占的寬度是由左邊境+左邊框+左填充+內(nèi)容+右填充+右邊框+右邊境組成，而css款式中width和height所定義的寬度和高度僅僅是內(nèi)容部分的寬度和高度，這是容易搞混的地方2、border 10-3.html border的外圍為元素的最外圍，的外圍為元素的最外圍，border的粗細(xì)會占據(jù)空間，因的粗細(xì)會占據(jù)空間，因此計算元素的實踐高和寬的時候要將此計算元素的實踐高和寬的時候要將border納入。納入。3、padding 10-6.html4、margin 10-8.html二、盒子模型 1、float定位 10-14.html 定義了

4、float屬性后，div的寬度自動為包含內(nèi)容的值，否那么那么默以為整行 2、position定位 10-20.html 3、z-index空間位置 默許值是后出現(xiàn)的元素覆蓋先出現(xiàn)的 4、實例：給圖片簽名運用css絕對定位，比ps的益處是可以輕松修正簽名三、元素的定位四、CSS+DIV規(guī)劃排版的觀念 1、將頁面用div分塊 11-1.html在設(shè)計網(wǎng)頁時，首先應(yīng)該先明確整個頁面的組成，并且在HTML中搭建好框架，然后才是排版，以及各個細(xì)節(jié)。 2、設(shè)計各塊的位置 當(dāng)頁面的內(nèi)容曾經(jīng)確定后，那么需求根據(jù)內(nèi)容本身思索整體的頁面排版，例如單欄、雙欄或左中右等。如以下圖常見的雙欄方式。 3、用css定位 11-1.html五、css+div版式1、一列規(guī)劃一列固定寬度 一列固定寬度居中 一列自順應(yīng)寬度 一列自順應(yīng)寬度居中 一列二至多塊規(guī)劃 2、兩列規(guī)劃二列自順應(yīng)寬度 二列固定寬度 二列固定寬度居中 3、三列規(guī)劃 三列自順應(yīng)寬度 三列固