盒子模型筆記

2022-07-15 08:39:12 字數 649 閱讀 1472

border:1px solid #ccc;

第乙個表示邊框粗細

第二個表示邊框線型

第三個表示邊框顏色

border-width -- 》 邊框粗細

border-style -- 》 邊框線型

border-color -- 》 邊框顏色

負責兩個盒子之間的距離

margin:10px; 上下左右都為10px

margin-top: 上邊距

margin-bottom: 下邊距

margin-left: 左邊距

margin-right: 右邊距

margin: 0 auto; 將左右的margin值設定為auto將使盒子左右居中顯示。

使用margin:0 atuo;的盒子必須要有width,有明確的width。

只有標準流的盒子,才能使用margin:0 auto; 居中。

也就是說,當乙個盒子浮動了、絕對定位了、固定定位了,都不能使用margin:0 auto;

margin:0 auto;是在居中盒子,不是居中文字。

文字的居中,要使用

text-align:center;

兩個塊級元素處於標準文件流中,那麼兩個盒子之間的距離為其中margin較大值

盒子模型 筆記

images cssbase.css layout.css index.css 脫離文件流 寬度不夠會掉下來 行內元素支援寬高 塊元素會根據內容撐開寬高 文字環繞 用到浮動必須清浮動 不要用inline block,用浮動 相對定位 根據自己定位 不會脫離文件流 絕對定位 脫離文件流 根據父級定位 ...

盒子模型(自學筆記)

把網頁元素比如文字等等,放入盒子,然後利用css擺盒子的過程,就是網頁布局 屬性作用 值border width 邊框粗細 畫素值border style 邊框樣式 solid 實線 dashed 虛線 dotted 點線 border color 邊框顏色 red blue等 連寫一般按照以下順序...

CSS筆記 盒子模型

一.盒子模型簡介 css將頁面中的所有元素都設定成了乙個矩形的盒子 將元素設定為矩形的盒子後,對頁面的布局就變成了將不同的盒子擺放到不同的位置 每乙個盒子都由以下幾個部分組成 內容區 content 內邊距 padding 邊框 border 外邊距 margin 二.內容區 content 使用w...