css - 為什么我的頁面布局會(huì)有問題?
問題描述
我想做一個(gè)如圖的頁面:
可是我的D部分總是到C的最下端,如圖:
每個(gè)塊我的css樣式都設(shè)為:
{float: left;display:block;}
若想達(dá)到圖1的效果,只有把D部分添加位置設(shè)置:
{position:absolute;}
然后給D指定上部距離多少多少。想知道有沒有別的方法,不是使用absolute的?謝謝各位~
問題解答
回答1:A B D 看成整體包在一個(gè)大塊里,與 C 左右布局,A B 左右布局, D 正常流布局就可以了啊,你現(xiàn)在的問題是 A B C 都float 了,沾滿了一行,D 當(dāng)然會(huì)從第二行再開始 float 了
回答2:float,浮動(dòng)。假如在一行之上只有極少的空間可供浮動(dòng)元素,那么這個(gè)元素會(huì)跳至下一行,這個(gè)過程會(huì)持續(xù)到某一行擁有足夠的空間為止。
回答3://css .right { float:right;}.left { float:left}.row::after{ content:’’; clear:both;}<p class='row'> <p class='left'><p class='row'> <p class='left'>A</p> <p class='right'>B</p></p><p> D</p> </p> <p class='side right'></p></p>回答4:
就現(xiàn)狀而言,ABC你都浮動(dòng)ok的,D你用相對(duì)定位讓它往上走走不就得了……另外我覺得ABC應(yīng)該可以用inline-block吧
相關(guān)文章:
1. 百度地圖 - Android app中準(zhǔn)備接入地圖sdk,百度VS高德哪個(gè)好一點(diǎn)?2. mongoDB批量插入文檔時(shí),運(yùn)行下面代碼,用MongoVUE查看數(shù)據(jù)庫,mongo庫中只存在一個(gè)文檔?不應(yīng)該是20個(gè)嗎?3. 百度地圖api - Android百度地圖SDK,MapView上層按鈕可見卻不可觸,怎么解決?4. javascript - html5的data屬性怎么指定一個(gè)function函數(shù)呢?5. css - 小程序canvas環(huán)形進(jìn)度條6. html5 - ajax post請(qǐng)求后如何渲染到頁面上7. javascript - 關(guān)于這組數(shù)據(jù)如何實(shí)現(xiàn) 按字母列表分類展示 不改動(dòng)數(shù)據(jù)結(jié)構(gòu)8. 前端 - html5 audio不能播放9. html - sumlime text3代碼自動(dòng)補(bǔ)全功能問題!10. css 選擇器 帶有 readonly 屬性 的<input> 怎么定位呢?
