NOTE:CSS

來源:互聯網
上載者:User

2009-9-12

 

1.關於網頁的幾種常見布局:

 

 

固定寬度布局:Fixed Width,這種很常見,像新浪部落格就是這種類型的。對於這種布局,在網頁寬度上有這麼個標準:

 

 

Many fixed-width designs are about 760 pixels widea good size for 800 x 600 screens (since you need to leave a little room for scrollbars and other parts of the browsers "chrome"). However, more and more sites (especially ones aimed at a more tech-savvy crowd) are about 950 pixels wide, on the assumption that visitors have at least 1024 x 768 monitors.

也就是:對於800*600的顯示器,760個像素是比較不錯的,對於1024*768的顯示器,950個像素比較合適。

 

2.關於margin屬性的參數問題:

3.關於absolute和relative:

relative在做位置位移時,參考的原點座標是自己的正常位置!注意:這個位置要受margin,padding這些元素的影響。

absolute做位移時一定要參考它的上級父容器,直至找到離他最近的帶有position屬性的父容器,然後以此父容器的原點為座標原點進行位移。

如果沒有找到,那參照的父容器就是<html>.

從實質上來講,position的作用就是要把一個元素移到一個指定的位置!移動的關鍵是要找好參照的座標原點。本質上講,relative和absolute就是兩種確定參照原點的方法。relative不管它的父視窗有沒有被position過,它只是很“單純”從它本來應該處的位置上進行移動。而absolute則是另外一套定位方法:它要找到一個被position過的父容器,以那個父容器為基準進行位移。這暗示:使用absolute的容器是要和被position過的父容器搭配使用的。從而聯合構建一種忽略各元素間原本的位置關係而直接參照父容器進行布局的方法!

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.