百度前端學(xué)院-基礎(chǔ)學(xué)院-第七天到第八天

zombieda 發(fā)布于2019-04-23 13:46 / 1663人閱讀

摘要：第五天到第六天的內(nèi)容沒(méi)有記筆記，不好不好。第七天到第八天的學(xué)習(xí)目標(biāo)是學(xué)習(xí)布局的各種方式。主要包含相關(guān)和相關(guān)。定位的元素應(yīng)該在文檔流中的間隙不再存在絕對(duì)定位的元素不再存在于正常文檔布局流程中。內(nèi)容較多，請(qǐng)參考學(xué)習(xí)了容器項(xiàng)

第五天到第六天的內(nèi)容沒(méi)有記筆記，不好不好。

第七天到第八天的學(xué)習(xí)目標(biāo)是：學(xué)習(xí)布局的各種方式。主要包含position相關(guān)和Flexbox相關(guān)。

知識(shí)點(diǎn)：

1、默認(rèn)情況下，塊級(jí)元素的內(nèi)容寬度是其父元素的寬度的100％，并且與其內(nèi)容一樣高。

2、概念：外邊距折疊。

3、position， static，默認(rèn)值；

? ? ? ? ? ? ? ? ? ? ? ?relative, 需設(shè)置top bottom left, right.方向是反的。與靜態(tài)定位很相似。

? ? ? ? ? ? ? ? ? ? ? ?absolute,?需設(shè)置top bottom left, right.?原點(diǎn)是最近的設(shè)置了position的祖先元素，如果沒(méi)有，則是html。定位的元素應(yīng)該在文檔流中的間隙不再存在,絕對(duì)定位的元素不再存在于正常文檔布局流程中。相反，它坐在它自己的層獨(dú)立于一切。

? ? ? ? ? ? ? ? ? ? ? ? fixed，?這與絕對(duì)定位的工作方式完全相同，只有一個(gè)主要區(qū)別——絕對(duì)定位固定元素是相對(duì)于??元素或其最近的定位祖先，而固定定位固定元素則是相對(duì)于瀏覽器視口本身。

4、flex布局。內(nèi)容較多，請(qǐng)參考https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Flexbox

? ? ? 學(xué)習(xí)了flex容器：flex-flow? align-items? justify-content? flex-

? ? ? ?flex項(xiàng)：flex?

云服務(wù)器 GPU云服務(wù)器前端學(xué)院第八天第七天阿里學(xué)院

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/2304.html

相關(guān)文章

百度前端學(xué)院-基礎(chǔ)學(xué)院-第七天到第八天之BFC

摘要：簡(jiǎn)介全稱中文為塊級(jí)格式化上下文。特征總之記住一句話元素特征表現(xiàn)原則就是內(nèi)部元素?zé)o論怎么翻江倒海，都不會(huì)影響外部元素。如何觸發(fā)，常見(jiàn)如下的值不為的值為，或。的值不為和需掌握自適應(yīng)模塊布局內(nèi)容很多，具體參考1、BFC簡(jiǎn)介 BFC全稱block formatting context,中文為塊級(jí)格式化上下文。特征總之記住一句話： BFC元素特征表現(xiàn)原則就是：內(nèi)部元素?zé)o論怎么翻江倒海，都不會(huì)影響外部元...

junfeng777 2019-04-23 13:46 評(píng)論0 收藏0
26天學(xué)通前端開(kāi)發(fā)（配資料）

摘要：網(wǎng)上有很多前端的學(xué)習(xí)路徑文章，大多是知識(shí)點(diǎn)羅列為主或是資料的匯總，數(shù)據(jù)量讓新人望而卻步。天了解一個(gè)前端框架。也可以關(guān)注微信公眾號(hào)曉舟報(bào)告，發(fā)送獲取資料，就能收到下載密碼，網(wǎng)盤(pán)地址在最下方，獲取教程和案例的資料。前言好的學(xué)習(xí)方法可以事半功倍，好的學(xué)習(xí)路徑可以指明前進(jìn)方向。這篇文章不僅要寫(xiě)學(xué)習(xí)路徑，還要寫(xiě)學(xué)習(xí)方法，還要發(fā)資料，干貨滿滿，準(zhǔn)備接招。網(wǎng)上有很多前端的學(xué)習(xí)路徑文章，大多是知...

blair 2019-08-21 16:59 評(píng)論0 收藏0
貪心學(xué)院-圖神經(jīng)網(wǎng)絡(luò)高級(jí)訓(xùn)練營(yíng)

摘要：百度網(wǎng)盤(pán)提取碼最近一直關(guān)注貪心學(xué)院的機(jī)器學(xué)習(xí)訓(xùn)練營(yíng)，發(fā)現(xiàn)這門(mén)課講的很有深度，不僅適合職場(chǎng)也適合科研人員，加入行業(yè)拿到高薪僅僅是職業(yè)生涯的開(kāi)始。 ??百度網(wǎng)盤(pán)??提取碼：u6C4最近一直關(guān)注貪心學(xué)院的機(jī)器學(xué)習(xí)訓(xùn)練營(yíng)，發(fā)現(xiàn)這門(mén)課講的很有深度，不僅適合職場(chǎng)也適合科研人員，加入AI行業(yè)拿到高薪僅僅是職業(yè)生涯的開(kāi)始。現(xiàn)階段AI人才結(jié)...

番茄西紅柿 2021-11-25 09:43 評(píng)論0 收藏2637
百度前端學(xué)院-基礎(chǔ)學(xué)院-第三課

摘要：第三天讓簡(jiǎn)歷有點(diǎn)色彩這一節(jié)課是來(lái)初步了解什么是，掌握基本的概念，語(yǔ)法，學(xué)習(xí)如何設(shè)置一些簡(jiǎn)單的樣式。設(shè)置文字陰影。取值較多，具體參考文本布局控制在盒子中的位置。設(shè)置字母與字母直接的間距，或者字與字直接的間距。第二步，瀏覽器顯示內(nèi)容。第三天：讓簡(jiǎn)歷有點(diǎn)色彩這一節(jié)課是來(lái)初步了解什么是CSS，掌握基本的CSS概念，語(yǔ)法，學(xué)習(xí)如何設(shè)置一些簡(jiǎn)單的樣式。好記性不如爛筆頭，開(kāi)始：字體： font-st...

DobbyKim 2019-04-23 14:38 評(píng)論0 收藏0
百度前端學(xué)院-基礎(chǔ)學(xué)院-第四課

摘要：今天是第四天，進(jìn)度可以，表?yè)P(yáng)一下自己。今天的課程目標(biāo)是掌握稍微復(fù)雜的一些選擇器，還有背景，邊框等一些樣式屬性。設(shè)置邊框?qū)挾?。今天是第四天，進(jìn)度可以，表?yè)P(yáng)一下自己。今天的課程目標(biāo)是：掌握 CSS 稍微復(fù)雜的一些選擇器，還有背景，邊框等一些 CSS 樣式屬性。 CSS背景：背景色：background-color:gray; 背景圖：background-image:url(www........

wean 2019-04-23 14:38 評(píng)論0 收藏0