如何製作個人網頁

如何建立自己的網站？我們都知道網頁佈局的覈心是使用CSS來放置方框。我們也知道盒子模型特別重要，它關係到網頁的美觀，圖片的大小，文字的大小，以及盒子模型的佈局，你知道如何把這些盒子模型放在我們的網站上嗎？請看下麵的幾頁來製作一張個人照片

我們之前說過，有些標記是塊級元素，它將獨佔一行，而有些標記是行內元素，它可以在一行中顯示三個。但有時我們只是想讓多個盒子（div）水准排列成一行，或者如何實現盒子的左右對齊？我該怎麼辦？

雖然我們之前討論過內聯塊，但它有自己的缺陷

1它可以在一行中顯示多個元素，但是中間會有間隙，這不能滿足上面的第一個問題。

2它無法實現上面的第二個問題。盒子左右對齊

準備三個盒子，把它們變成線塊

每個框的中間都有一個默認的間隙

我們不知道默認空白的大小，也擺脫不了它，但我們網站設計草稿中的一些空白是精確量測的，而不是默認空白

比如我們在看百度圖片網頁時，每幅圖片的大小都是一樣的，圖片的擺放也是井然有序的，但是默認的空白間隙會影響美觀，甚至會使框型風格雜亂無章

這就是百度圖片的放置管道

此時，我們需要知道CSS提供了三種機制來設定框的位置，即正常流（標準流）、浮動和定位

1正常流量（標準流量）

-塊級元素將佔用一行，自上而下排列；（以前塊元素和行內元素已經寫入，行內塊元素的顯示方式為正常流）

2浮動

-讓框從普通流中浮動，主要功能是讓多個塊級框顯示在一行中。

三。定位

-設定框在瀏覽器的某個位置-CSS的定位是分不開的，特別是將來用JS效果。

什麼是漂浮？

由於一些頁面的佈局要求，標準的流程不能滿足我們的需要，所以需要通過浮動來完成頁面的佈局。

元素浮動是指具有浮動内容的元素將：

1脫離標準公共流的控制

2移動到指定位置。