特定網站的CSS佈局

Question

我真的很喜歡這個網站用他們的CSS佈局做了什麼。是否有任何教程可以讓我指出/解釋佈局 - 特別是如何讓較小的鏈接圖像排列在較大的圖像上。我有點新設計。讓我知道。

網站：http://www.fssjax.org

感謝

Answer 1

下載Firefox's Web Developer Add-on和Firebug。 （Chrome有類似的東西 - 其他瀏覽器也可能）。

安裝完成後，請訪問相關頁面，然後單擊大綱 - >大綱當前元素。這樣做會使你翻滾的任何東西都會向你展示一個紅色的邊框 - 這將幫助你理解組成頁面的所有部分。

然後，右鍵單擊某個元素並單擊檢查元素（位於彈出選項的底部）。這將向您展示左側的HTML和右側的CSS - 瞭解他們如何佈置頁面的完美方式。

Answer 2

下載Firebug爲Firefox，它可以讓你方便地檢查網頁上的元素，看看他們的CSS等瀏覽器也有一個bult式檢查。

檢查一個元素，看看css然後谷歌找出如果你不確定css會做什麼。

Answer 3

好吧好吧，這是怎樣的一個垃圾雖然導航的...

反正導航使用FLOAT（http://www.w3schools.com/css/css_float.asp）屬性建。兩個元素（容器）按順序放置，然後第一個（nav）浮動到第二個的左側。還有位置（http://www.w3schools.com/cssref/pr_class_position.asp）屬性的用法將其移到圖片上。

和其他人說的一樣，使用Firebug來弄清楚一切都在做什麼。