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

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

Grid布局基礎

難度中級
時長 3小時18分
學習人數
綜合評分9.17
18人評價 查看評價
9.6 內容實用
8.4 簡潔易懂
9.5 邏輯清晰
參考老師某某集團智能云數據中心布局，有需要的同學可以看一下 github：https://github.com/ar414-com/web/tree/master/htmlgrid
EWL
float/columns/clear/vertical-align不生效的部分是網格容器的網格項，也就是網格容器中包含的子項這些屬性不會再生效，這樣講會更清晰一些，最開始我誤以為是容器的這些元素不生效。

最新回答 / weibo_用戶59165236_0
gap簡寫是行列間距寬度是同一個值吧
慕課網很好，能將相對新的技術教程視頻免費奉獻出來給人學習，真的很棒 ，為其點贊！
.container {
place-items: <align-items> / <justify-items>;
}


.container {
grid-gap: <grid-row-gap> <grid-column-gap>;
}


先垂直后水平，方向一致?。?！
MDN上沒有用行和列的方式去描述items，而是明確為水平方向或垂直方向對齊。因而開篇對items描述為沿著行方向或列方向的詞語直接導致實例最后結論為行列參數和gap相反。如果按講師的定義是沒錯。但是容易產生混淆。最好用水平方向或垂直方的描述，而且和gap之類參數順序沒有比較可言
我的理解是對的。gap的行間距指的的垂直（行）方向的間距。同樣，place-items的行對齊指的也是垂直（行）方向的對齊方式。講師錯誤將一行內（水平方向）的每個網格項的列對齊方式視作行對齊方式。gap、items、content的簡寫方向是一致的！望更正?。?！
為什么視頻中我看到的place-items是按“行，列”簡寫的呢？！視頻中說反了。place-items:"start end"渲染結構為右上角---行為start,列為end
老師講的非常細致，之前自己杜宇這塊只是大概了解，看了視頻教程更加深入的學習了一下，這個適合布局提升的學習，很實用！
4-3 老師提到 auto-fill 與 auto-fit 后面搭配固定值時不生效，這句話不夠嚴謹吧
老師講得非常棒，課程中介紹的那個案例，我們的項目中正在使用，貌似更加復雜。^_^
嘔吐，哦給，哈哈哈
我是被哦給哦給的給說暈了。。。。為什么老是哦給，一點也不哦給啊。。。
哦給，哦給
首頁上一頁123456下一頁尾頁
課程須知
學習之前需要掌握HTML基礎、CSS基礎，position、float、以及flex布局。
老師告訴你能學到什么？
學會使用Grid布局實現二維網格布局系統，靈活盡心布局，學會更主流、更簡潔的布局方案。

微信掃碼，參與3人拼團

微信客服

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

 幫助反饋 APP下載

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

 公眾號

掃描二維碼
關注慕課網微信公眾號
友情提示：

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

本次提問將花費2個積分

你的積分不足，無法發表

為什么扣積分？

本次提問將花費2個積分

繼續發表請點擊 "確定"

為什么扣積分？

舉報

0/150
提交
取消