盒子邊界(根據(jù)理解和測試記錄，在概念上可能有描述錯誤，推薦補(bǔ)充)

stormzhang 發(fā)布于2019-08-02 14:01 / 1833人閱讀

摘要：測試測試測試測試在以前蠢蠢的不知道的時候，有時候會通過給增加然后給最后一個去除類似這樣，雖然這樣可以解決，但是不推薦。如果與的邊界值大于會小于之間的間距時，可以根據(jù)情況重新設(shè)置首尾邊界的具體值。

前言：邊界屬性margin是盒子與盒子之間的間距，一定要記住這個前提。

BFC

滿足下列條件之一就可觸發(fā)BFC(IE的觸發(fā)需要再額外增加zoom: 1)

根元素，即HTML元素

overflow的值不為visible

設(shè)置border

float的值不為none

display的值為inline-block、table-cell、table-caption

position的值為absolute或fixed

邊界值重疊

兩個相鄰的塊級元素之間的margin邊界值會互相重疊。如：第一個div的margin-bottom和第二個div的margin-top區(qū)域會重疊，只顯示最大值。(其實(shí)說實(shí)在的，應(yīng)該沒人會這么寫，畢竟直接設(shè)置一個盒子的的邊界值就可以了。但是這個還是需要注意的。)

解決方法：其中一個div增加子元素，并設(shè)置overflow的值不為visible(觸發(fā)BFC的元素都可以解決,根據(jù)樣式需求選擇合適的方法即可)，然后子元素設(shè)置邊界值。



  測試

測試

邊界值無效, 第一個子元素的margin-top和最后一個子元素的margin-bottom越界問題(重點(diǎn))

 

  測試
  測試
  測試
  測試

解決方法：通常情況下，我們會選擇給li一個邊界top或者bottom來分割開每個li之間的間隔，但是你會發(fā)現(xiàn)，第一個子元素的margin-top和最后一個子元素的margin-bottom不會產(chǎn)生跟ul之間的間距，會出現(xiàn)越界。其實(shí)一樣的處理。



  測試
  測試
  測試
  測試

ps: 在以前蠢蠢的不知道的時候，有時候會通過給ul增加padding-bottom,然后給最后一個li去除margin類似這樣，雖然這樣可以解決，但是不推薦。如果li與ul的邊界值大于會小于li之間的間距時，可以根據(jù)情況重新設(shè)置首尾邊界的具體值。

云服務(wù)器 GPU云服務(wù)器云盒子安裝在服務(wù)器上云盒子能安裝在服務(wù)器上嗎大數(shù)據(jù)概念理解訪問云服務(wù)器錯誤可能原因

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

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

相關(guān)文章

盒子邊界(根據(jù)理解和測試記錄，在概念上可能有描述錯誤，推薦補(bǔ)充)

摘要：測試測試測試測試在以前蠢蠢的不知道的時候，有時候會通過給增加然后給最后一個去除類似這樣，雖然這樣可以解決，但是不推薦。如果與的邊界值大于會小于之間的間距時，可以根據(jù)情況重新設(shè)置首尾邊界的具體值。前言：邊界屬性margin是盒子與盒子之間的間距，一定要記住這個前提。 BFC 滿足下列條件之一就可觸發(fā)BFC(IE的觸發(fā)需要再額外增加zoom: 1) 根元素，即HTML元素 overfl...

Genng 2019-08-30 15:55 評論0 收藏0
不用寫代碼，也能做好接口測試

摘要：接口測試形式單個接口測試包含性能測試和通過接口調(diào)用進(jìn)行場景測試。充分來說就是接口測試相對容易實(shí)現(xiàn)自動化持續(xù)集成。本文你將了解到 1、接口測試基本概念，包含什么是接口，什么是接口測試，為什么要做接口測試2、接口測試用例設(shè)計(jì)3、怎樣不用寫代碼，也能快速的根據(jù)開發(fā)的API文檔完成接口自動化測試腳本注：如果你對接口基本概念和接口測試用例已熟悉，可以直接跳過，其實(shí)看一遍也無防，就當(dāng)作溫故知...

idisfkj 2019-07-01 10:48 評論0 收藏0
軟件測試肖sir__005測試用例設(shè)計(jì)方法（1）

摘要：需要結(jié)合其他測試用例設(shè)計(jì)的方法進(jìn)行補(bǔ)充。比如邊界值邊界值在軟件中邊界值測試方法是發(fā)現(xiàn)錯誤能力最強(qiáng)的一種。其中，原因是表示輸入條件，結(jié)果是對輸入執(zhí)行的一系列計(jì)算后得到的輸出。與取值或，表示某狀態(tài)不出現(xiàn)，則表示某狀態(tài)出現(xiàn)。 ...

gnehc 2021-10-13 09:39 評論0 收藏0
測試基本面試知識

測試基本知識1、請你分別介紹一下單元測試、集成測試、系統(tǒng)測試、驗(yàn)收測試、回歸測試：（1）單元測試：完成最小的軟件設(shè)計(jì)單元（模塊）的驗(yàn)證工作，目標(biāo)是確保模塊被正確的編碼，使用過程設(shè)計(jì)描述作為指南，對重要的控制路徑進(jìn)行測試以發(fā)現(xiàn)模塊內(nèi)的錯誤，通常情況下是白盒的，對代碼風(fēng)格和規(guī)則、程序設(shè)計(jì)和結(jié)構(gòu)、業(yè)務(wù)邏輯等進(jìn)行靜態(tài)測試，及早的發(fā)現(xiàn)和解決不易顯現(xiàn)的錯誤。（2）集成測試：通過測試發(fā)現(xiàn)與模塊接口有關(guān)的問題。目...

不知名網(wǎng)友 2021-11-26 11:10 評論0 收藏0
??【全網(wǎng)最全】花費(fèi)3小時整理出5000字軟件測試必須掌握的基本理論知識！??

軟件測試的基本理論知識有很多，?根據(jù)不同情況劃分的，內(nèi)容比較多~ 目錄 1、軟件測試概述 2、軟件測試基礎(chǔ)軟件的概念 3、軟件測試分類 4、白盒測試用例設(shè)計(jì)方法 5、黑盒測試用例設(shè)計(jì)方法 6、缺陷管理軟件缺陷 1、軟件測試概述軟件測試的IEEE定義：使用人工或自動的手段來運(yùn)行或測量軟件系統(tǒng)的過程，目的是檢驗(yàn)軟件系統(tǒng)是否滿足規(guī)定的需求，并找出與預(yù)期結(jié)果之間的差異。軟件測試的發(fā)展趨勢： ①　測試工...

ivan_qhz 2021-09-03 10:28 評論0 收藏0