資訊專欄INFORMATION COLUMN
摘要：內容不會被修剪，會呈現(xiàn)在元素框之外。內容會被修剪，但是瀏覽器會顯示滾動條以便查看其余的內容。規(guī)定應該從父元素繼承屬性的值。
1.任意一個元素都可以當作盒模型
2.盒子的大小由內容寬高(width/height)+邊距(padding)+邊框(border)
3.盒子由外邊距(margin),影響盒子的位置
廣義盒模型:文檔中所有功能性及內容性標簽,及文檔中所有顯示性標簽.
狹義盒模型:文檔中以塊級形式存在的標簽(塊級標簽擁有盒模型100%特性且最常用)border成員:border-left、border-right、border-top、border-bottom
border-style成員：border-left-style、border-right-style、border-top-style、border-bottom-style
| 風格 | 解釋 |
|---|---|
| solid | 實線 |
| dashed | 虛線 |
| dotted | 點狀線 |
| double | 雙實線 |
| groove | 槽狀線 |
| ridge | 脊線 |
| inset | 內嵌效果線 |
| outset | 外凸效果線 |
| 賦值個數(shù) | 方位 |
|---|---|
| 1 | 上下左右 |
| 2 | 上下|左右 |
| 3 | 上|左右|下 |
| 4 | 上|右|下|左 |
| 成員 | 解釋 |
|---|---|
| border-top-left-radius | 左上 方位 |
| border-top-right-radius | 右上 方位 |
| border-bottom-left-radius | 左下 方位 |
| border-bottom-right-radius | 右下 方位 |
賦值個數(shù)(值類型:長度或百分比):1 解釋為:橫縱
賦值個數(shù)(值類型:長度或百分比):2 解釋為:橫|縱格式:1/1 解釋為:橫向|縱向| 值 | |
|---|---|
| visible | 默認值。內容不會被修剪，會呈現(xiàn)在元素框之外。 |
| hidden | 內容會被修剪，并且其余內容是不可見的。 |
| scroll | 內容會被修剪，但是瀏覽器會顯示滾動條以便查看其余的內容。 |
| auto | 如果內容被修剪，則瀏覽器會顯示滾動條以便查看其余的內容。 |
| inherit | 規(guī)定應該從父元素繼承 overflow 屬性的值。 |
| 值 | 描述 |
|---|---|
| inline | 內聯(lián) |
| block | 塊級 |
| inline-block | 內聯(lián)塊 |
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://m.hztianpu.com/yun/1761.html
摘要：盒模型要點知識務必注意看，這可是前端面試必定會遇到的問題。盒模型的主要屬性，除繼承外有兩個值這里不再細說歷史原因，只說其作用。嚴格來說與標簽大小無關，但是影響視覺上的位置。具象化需調試指出，如下其中的最外圈的黃色區(qū)域就是了。 盒模型要點知識 務必注意看，這可是前端面試 必定會遇到 的問題。 box-sizing 盒模型的主要CSS屬性，除繼承外有兩個值： content-box...
摘要：盒模型要點知識務必注意看，這可是前端面試必定會遇到的問題。盒模型的主要屬性，除繼承外有兩個值這里不再細說歷史原因，只說其作用。嚴格來說與標簽大小無關，但是影響視覺上的位置。具象化需調試指出，如下其中的最外圈的黃色區(qū)域就是了。 盒模型要點知識 務必注意看，這可是前端面試 必定會遇到 的問題。 box-sizing 盒模型的主要CSS屬性，除繼承外有兩個值： content-box...
摘要：標準的的盒子模型與低版本的盒子模型有什么不同的標準盒子模型寬度內容的寬度與向內容外填充低版本盒子模型寬度內容寬度與向內容內填充標準盒子模型盒子模型上刺刀可以看出我們設置了屬性用來控制元素的盒子模型的解析模式，默認為的標準盒子模型，設 標準的CSS的盒子模型與低版本IE的盒子模型有什么不同的？ 標準盒子模型：寬度=內容的寬度（content）+ border + padding + ma...
摘要：前端之盒模型顯隱定位與流式布局思想前端之盒模型顯隱定位與流式布局思想盒模型的顯隱盒模型的顯隱盒子的顯隱通過控制盒子的顯示方式來隱藏盒子該隱藏方式在頁面中不占位通過控制盒子的透明度來隱藏盒子該隱藏方式在頁面中占位注一般顯隱操作的盒子都是采用前端之盒模型顯隱、定位與流式布局思想 盒模型的顯隱 盒子的顯隱 .box, .wrap { ...
閱讀 3514·2019-08-30 13:15
閱讀 1458·2019-08-29 18:34
閱讀 885·2019-08-29 15:18
閱讀 3537·2019-08-29 11:21
閱讀 3313·2019-08-29 10:55
閱讀 3762·2019-08-26 10:36
閱讀 1930·2019-08-23 18:37
閱讀 1908·2019-08-23 16:57
