T-CSS基础-day02-尺寸和边框、框模型

四.尺寸和边框

1. 尺寸
   设置元素在页面中的宽高（对高度设置比较少，更关注宽度的设置）
   width:取值：以px为单位的数字；rem为单位的数字；%父元素宽度百分比
   height:取值：以px为单位的数字；rem为单位的数字；%：父元素没有定义高度，就失效。父元素有定义高度，就是这个高度的百分比（要注意）
   在不写死宽高属性时（百分比可以），还可以设置下列四个属性：
   max-width 限制元素最大的宽度
   min-width 限制元素最小的宽度
   max-height 限制元素最大的高度
   min-height 限制元素最小的高度
   注意，如果给img设置 max-width:100%;：不是父元素的100%，这里的100%是图片原始尺寸的100%；意味着，这张图片可以缩放，但是最大不能超过本身原始尺寸的100%

---

附加知识点----单位
尺寸的单位

1. 绝对单位
   1. px 像素
   2. in 英寸 1in=2.54cm
   3. pt 磅值，多用于定义字号大小：1pt=1/72in
   4. cm
   5. mm
2. 相对单位
   1. em：以父元素设置的值为一个基本单位，1.5em。就是1.5个基本单位
   2. rem：以html标签设置的值为一个基本单位
      如果html没有设置值，1rem默认为16px
   3. %：多数是父元素设置值的百分比

---

2. 页面中可以设置尺寸的元素
   1. 所有块级元素都可以设置尺寸
   2. 大多数行内元素不能设置尺寸
   3. 所有行内块可以设置尺寸(input)
   4. 所有自带宽高属性的元素，都可以设置宽高(如：img)
3. 元素默认的宽高值是多少

块级	行内	行内块
不写宽度，默认宽度是父元素的100%；不写高度，高度靠内容撑开，如果没有内容，高度为0	不写宽高时，宽高都是靠内容撑开。没有内容就为0（如果在当前行还要有其他行内元素，则宽为0，高为同行行内元素的高度）	不写宽