HTML、CSS、DIV布局是現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)的基礎(chǔ)。HTML定義了頁(yè)面的基本結(jié)構(gòu)，CSS控制頁(yè)面的樣式和布局，而DIV布局提供了一種靈活而強(qiáng)大的方式來(lái)構(gòu)建網(wǎng)頁(yè)。接下來(lái)介紹下這三個(gè)技術(shù)的具體實(shí)現(xiàn)。
HTML
HTML（超文本標(biāo)記語(yǔ)言）是用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)準(zhǔn)語(yǔ)言。HTML使用標(biāo)記來(lái)定義網(wǎng)頁(yè)內(nèi)容的結(jié)構(gòu)。HTML標(biāo)記通常由尖括號(hào) "<" 和 ">" 包圍，并成對(duì)出現(xiàn)。例如：“<html>”和“</html>”標(biāo)簽定義網(wǎng)頁(yè)的開(kāi)頭和結(jié)尾。
CSS
CSS（層疊樣式表）是網(wǎng)頁(yè)樣式的語(yǔ)言。它可以控制網(wǎng)頁(yè)中元素的顏色、大小、字體等，還可以規(guī)定元素的位置、邊距和布局。CSS可以內(nèi)嵌在HTML文檔中，也可以通過(guò)外部樣式表鏈接到HTML文檔中。例如：
<head>
<style>
p {color:red;}
</style>
</head>DIV布局
DIV布局是一種基于DIV元素的布局方式。DIV元素分為塊級(jí)元素和內(nèi)聯(lián)元素。塊級(jí)元素占據(jù)一行或一整個(gè)頁(yè)面的寬度，例如“<div>”標(biāo)簽；內(nèi)聯(lián)元素則只占據(jù)自身內(nèi)容尺寸的寬度，例如“<span>”標(biāo)簽。通過(guò)對(duì)DIV元素的定義及樣式設(shè)置，可以實(shí)現(xiàn)網(wǎng)頁(yè)元素的位置、大小與布局。例如：
<div style="width: 500px; height: 300px; background-color: blue; float: left;"></div> <div style="width: calc(100% - 500px); height: 300px; background-color: green; float: left;"></div>
以上兩個(gè)DIV元素的設(shè)置實(shí)現(xiàn)了一個(gè)藍(lán)色DIV和一個(gè)綠色DIV并列排列的效果。