.盒子模型
(1)重要的組成元素:
content(內容),padding(內邊距),border(邊框),margin(外邊距)
(2)margin
margin:100px auto;(100px 表示的是上下的外邊距 auto表示的左右水平居中)
margin:10px,20px,30px,40px;(上,右,下,左,)
margin;10px,20px,30px;(0px 表示上 20px表示左/右 30px表示下)
margin: 10px 20px;(10px表示上下 20px表示左右)
margin: 30px;(30px表示上右下左 都為這值)
(3)讓元素中的內容與元素邊框之間的距離增大,可以設定元素的內邊距
padding: 10px 20px 30px 40px;(上10px,右20px,下30px,左40px)
padding: 10px 20px 30px;(上 , 左/右 , 下)
新聞列表
產生:元素溢位指乙個元素中含有其他元素,而其他元素超出了這個元素(父元素),我們把這種情況稱之為元素溢位.
解決方法:
overflow:hidden;超出父元素的部分隱藏(剪下)不在可見
overflow: scroll;設定此屬性,內容會被裁剪, 但是會新增滾動條,以便顯示被裁剪的內容
overflow:visible;預設值,不會修剪,會呈現在元素框外
overflow-y:scroll;垂直滾動條
overflow-x:scroll;水平滾動條
overflow:auto;如果剪下了才顯示滾動條
CSS盒子模型和層元素
盒子模型針對css中每個元素 padding後加元素格式 四元素 上 右 下 左 三元素 上 左右 下 兩元素 上下 左右 也可以 margin border和padding同樣擁有以上一樣規則。content1 content box width 50px height 50px backgrou...
css盒子模型 CSS 盒子模型
css 盒子模型基本上是面試的必考題，因為實在是太重要了。以前寫 css 總是感覺元素的寬高十分難調，其中乙個很大的問題就是忽略了盒子模型的重要性。說到 css 盒子模型，你可能會說我知道呀，就是 margin 包 border,border 包 padding,padding 包 content ...
css盒子模型 說說css盒子模型
引用mdn官方的解釋 當對乙個文件進行布局 lay out 的時候，瀏覽器的渲染引擎會根據標準之一的 css 基礎框盒模型 css basic box model 將所有元素表示為乙個個矩形的盒子 box css 決定這些盒子的大小 位置以及屬性 例如顏色 背景 邊框尺寸 每個盒子由四個部分 或稱區...