布局的一點總結

2022-03-21 09:51:58 字數 955 閱讀 7777

1.box布局

box布局實現了浮動,並且預設沿著一行排列div。超過部分在頁面可視區域之外(一行的右邊),超過部分不會跑到下一行。

box布局的好處:如果左對齊,不用考慮子元素的寬度, box 就可以實現真正意義上的流體布局。只要給出相應屬性,瀏覽器會幫我們做額外的計算。

2.選擇按鈕

如果用input的物件,選擇按鈕其實只有radio物件,button物件只在點選事件的時候使用。

第1個樣式是為未選擇狀態,第2個樣式是選中狀態。第二個樣式的寫法注意:在第1個樣式上,多了1個樣式而非切換樣式。這樣的好處是很容易獲取到操作。

這樣,我們用js獲取選中的按鈕可以這麼寫:

$(".cur")

3.頁面錯亂

在修改少量的樣式布局後,頁面完全錯亂,經常以下兩種原因:

1).    

子元素浮動,為清除浮動,導致父元素高度塌陷,與父元素同級的元素占用這塊區域,頁面布局不正常。

2).     絕對定位的問題,絕對定位跟元素層次有關係,定位的標準是尋找最近的有定位的父元素(position:relative也算)。如果父元素忘記寫定位,會出現錯位,這時候會一直向上找有定位的元素,直至body。

3).    

4).      margin重疊

也是inline元素,但是

和另乙個inline元素input,都可以設定高度。他們有個稱呼,叫替換元素。除了他們兩這,還又、、都是替換元素。他們是自身的某個屬性決定顯示的內容,這樣一類元素。

inline元素設定水平居中,在父級塊級元素上設定屬性:text-align:center;那麼,現在的問題是垂直居中的問題了。

2)可以固定大小,那麼填充margin,padding這些。只要的這些填充四個方向的數值相同,放進去後自然居中。

5 輪播圖:

關於自適應布局的一點總結

css布局我想是經常困擾初學前端者的乙個問題,至於我,也是初入門檻。在閒暇時間,就喜歡自個兒琢磨,自己也就是這樣不斷地進步的。我想經過不斷的學習,前端技能肯定會更上一層樓的。今天就 下css的自適應布局吧。所謂自適應布局,現在的淺顯地認為就是百分比布局,它能隨著瀏覽器視窗的縮放而自行改變其寬度和高度...

iOS布局和螢幕適配的一點總結

我不知道有沒有更好的辦法,我們的做法是根據裝置型別,寫一些if.else,或者switch語句 判斷機型可以使用screen的height 不能使用width,因為4和5的width是一樣的,都是320 也可以使用api裡的巨集,都差不多。我個人感覺,if.else似乎是不可避免的,雖然有auto ...

iOS布局和螢幕適配的一點總結

曾經,ios開發是不需要考慮螢幕適配問題的,因為只有一種螢幕尺寸。而現在已經有了4種螢幕,4,5,6,6p,因此螢幕適配也成了ios開發中必須考慮的問題。並且,這4種螢幕的寬高比全部都不一樣,所以簡單的按比例縮放並不能解決問題。我們最近做的乙個app也處理了螢幕適配,本文簡單總結一下 我不知道有沒有...