總結盒模型的考點

2021-08-27 16:25:08 字數 581 閱讀 2026

盒模型,前端面試中必考的點!

盒子模型有兩種 :w3c標準盒模型+ie盒模型

w3c定義的盒子模型包括margin、border、padding、content ,元素的width=content的寬度

ie盒子模型與w3c的盒子模型唯一區別就是元素的寬度,元素的width=content+padding+border

考點總結

雖然面試的次數不多,但是前端每次面試考官都會問到這個問題,再好好總結一下。

中間很多知識點也涉及到了以下知識:

bfc(塊級格式化上下文)

布局問題(重點)

所有布局的top、right、bottom、left

盒模型總結

超級工具人 實力不夠震撼,吸引不夠震撼,追到女朋友也沒有用,不是工具人做到死就是麻煩一大堆。css處理網頁時,它認為每個元素都包含在乙個不可見的盒子裡。為什麼要想象成盒子呢?因為如果把所有的元素都想象成盒子,那麼我們對網頁的布局就相當於是擺放盒子。我們只需要將相應的盒子擺放到網頁中相應的位置即可完成...

盒模型和總結

盒模型 包含有外邊距margin 和內邊距padding 邊框border和內容element 盒子的寬 高 margin 2 padding 2 border 2 element 也就是乙個模型的總長度是所有的邊距加盒子邊框的粗度和元素本體的寬高 margin的方法 margin top marg...

標準盒模型 怪異盒模型 彈性盒模型

box sizing content box 標準盒模型 標準盒模型總寬度 border2 padding2 content box sizing border box 怪異模式 怪異盒模型的總寬度 width margin 左右 width已經包含了padding和border值 flex dir...