亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

如何用CSS進行網頁布局

江老實 Web前端工程師
難度初級
時長22分
學習人數
綜合評分9.60
1991人評價 查看評價
9.8 內容實用
9.6 簡潔易懂
9.4 邏輯清晰

已采納回答 / 慕虎9205161
首先,答案有很多種,很簡潔的如下.top{height:100px;background:#ccc;}.main{height:500px;background:red;}.left{width:30%;height:500px;background:blue;float:left;}.right{width:65%;height:500px;background:green;float:right;}.foot{height:100px;background:yellow;}width:100%;這玩意...

已采納回答 / 苦瓜ts
規定要要求右側(right)先加載,左側(left)后加載,所以想用float可以改動html結構。left設置往左浮動(width規定為200px);right不用浮動,margin-left設置大于200px,這樣就做到類似布局。具體代碼如下:<...code...>思路有點像三欄布局中的那種特殊布局。用margin來限制容器邊界,達到寬度自適應的目的。

已采納回答 / 給我一杯咖啡
body為主體內容,當然也算一個大的div,您將body設置一個固定的寬margin:0 auto;就可以讓它居中辣

已采納回答 / summer樂
英文就是會出現超出界限的問題,所以需要加上一些設置,給容器加上這個CSS樣式word-wrap?: break-word;表示在邊界內要換行1.word-wrap : normal ?,其中normal為默認值,當其值為normal控制連續文本換行(允許內容頂開容器的邊界,換句話說內容可以撐破容器);?2.word-wrap : break-word,break-word將內容在邊界內換行??

已采納回答 / 浮生若夢思
說明你的采用絕對定位,left,right是與上一級采用絕對定位或者相對定位元素的左右距離,如果外部元素沒有采取相對定位或者絕對定位的,這里的left,right是指與html即頁面左右距離。

已采納回答 / DD慕帆
可以使用快捷鍵”ctrl+/“,如果你沒有改的話,很多編輯軟件都適用

已采納回答 / qq_耳東東_04258867
.right{width:65%; height:600px; background-color:green; float:right; }}最后多了一個括號!去掉就行了

已采納回答 / 湯包桑
兩個方案給DIV填充內容給DIV指定width以及height(別忘了background-color)

已采納回答 / CIPHER
同學,建議你跟著按一下代碼。這樣很多問題都會迎刃而解。希望我的回答對你有幫助!

已采納回答 / 黑白灰菌
我所理解的是:絕對定位是會脫離文檔流的,左側div和右側div設置了絕對定位直接無視文檔流處在該處的位置。中間的div是普通流,它設置了一個margin-left和margin-right,就是視頻中的margin:0 300px 0 200px,所以不會和左側右側重疊,我沒有理解你說的文字內容沒有被覆蓋是什么意思,方便的話可以放出你的代碼。

已采納回答 / Blizzard_lihe
<...圖片...>僅供參考

最新回答 / 慕移動9181930
補充一點,這個是針對文本,修改選中文背景色和文本顏色。我自認js基礎已經很好了,看著還是很窩心。

已采納回答 / kiss仔仔
<!DOCTYPE html><html>????<head>????????<title></title>????</head>????<body>????</body></html>用這種格式寫

已采納回答 / weibo_石頭是stone_03478
不可以,left左浮動,脫離了文檔流,沒有問題。middle是<div>塊級元素,緊跟著left,但是會占滿一行。right緊跟著,會另起一行,浮動居右。雖然將middle在body部分中放在left、right后面,表面上可以滿足結果,但是middle中的內容變多了,就會占據right中空間。
課程須知
1.你需要掌握html+css樣式基礎知識 2.有一定的前端實際開發經驗
老師告訴你能學到什么?
1.掌握網頁布局的相關知識 2.能對不同的網頁進行布局結構劃分 3.掌握固定寬度和自適應寬度的實現方法

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!

本次提問將花費2個積分

你的積分不足,無法發表

為什么扣積分?

本次提問將花費2個積分

繼續發表請點擊 "確定"

為什么扣積分?

舉報

0/150
提交
取消