第三章 盒子模型筆記

2021-08-20 18:07:00 字數 1576 閱讀 6850

1.盒子模型-border

組成寬度、顏色、樣式:

border-width: 2px;/*邊框寬度*/

border-color: pink;/*邊框顏色*/

border-style: solid;/*邊框樣式*/

復合寫法border: 1px solid pink;

left:

right:

top:

bottom;

**示例:

.box

border-style: solid;  /*預設3px黑色邊框*/

單例型寫法/複合型寫法

border:厚度 樣式 顏色;對四條邊

border-right:厚度 樣式 顏色;

border-right-width:右邊厚度

border-width: 10px 10px 10px 10px;上 右 下 左

border: none;去除邊框

border-color:blue/red/yellow

border-color:rgb(255,0,0)

border-color:rgba(255,0,0,0)//alpha:0透明,1不透明

border-color:#ffffff

2、盒子模型外邊框-margin

margin:10px;/*外邊距,上右下左各10px*/

margin-top:

margin-right:

margin-bottom:

margin-left:

margin:10px 30px;/*上下10px,左右30px*/

margin:10px 30px 50px;/*上10px,左右30px,下50px*/

margin:auto;

margin:0 auto;/*常見水平居中方式*/

二個相鄰的盒子外邊距合併特性

解決合併問題:

1、給父級設定內邊距代替自己外邊距

2、給父級加邊框

3、給父級overflow:hidden

4、設定絕對定位

5、設定display:inline-block;

%:基於父元素寬度的百分比的外邊距

inherit:從父元素繼承外邊距

3、盒子模型內邊距-padding

4、盒子寬度高度計算:

正常模型:

box-sizing:content-box(預設)、往外擴

width/height+border+padding+margin(左右和上下)

怪模模型:

border-box計算寬度width/height+border+padding往內縮

.box1,.box2

5、外邊距和內邊距合拼問題

解決方案:

overflow:hidden;解決內邊距重合的

float: left;

display: inline-block;

border:1px transparent solied;

transparent:透明

第三章筆記

第三章預習筆記 一 高階語言和機器指令中的運算 1,按位運算 符號 按位or運算 符號 按位and運算 符號 表示按位not運算 符號 按位xor運算。實現掩碼操作 通過與給定的乙個位模式進行按位與,可以提取所需要的位,對這些位進行 置1 清0 等。2,符號 按位or運算 符號 表示and運算 符號...

第三章 線性模型

線性模型 linear mode 試圖學得乙個通過屬性的線性組合來進行 的函式 f x 1x1 2x 2 d xd b 向量形式 f x t x b 其中 1 2 d x x1 x2 x d 為由d個屬性描述的示例,x i 是 x 在第 i 個屬性上的取值。線性模型形式簡單,有豐富的變化,易於建模,...

c primer 筆記,第三章

初始化string物件的6種方式 string s1 預設空串 sting s2 s1 string s2 s1 string s3 value 直接初始化 string s3 value 拷貝初始化 string s4 n,c 由連續n個字元c組成的串在讀寫string物件時,string物件會自...