行盒

定义：display属性为inline的元素

常见的行盒：包含具体内容的元素

span，strong，em，i，img，video，audio

特点

1.盒子沿着内容延伸

2.行盒不能设置宽高

应使用字体大小，行高，字体类型来间接调整

3.内边距（填充区）

水平方向有效，垂直方向仅仅会影响背景，不会占据空间，会覆盖别的盒子，而不是挤走

4.边框

水平方向有效，垂直方向仅仅会影响背景，不会占据空间，会覆盖别的盒子，而不是挤走

5.外边距

水平方向有效，垂直方向仅仅会影响背景，不会占据空间，会覆盖别的盒子，而不是挤走

margin: 786px 445px;第一个填写垂直方向，第二个填写水平方向

6.行块盒

display: inline-block的盒子
一；不独占一行
二；盒模型中所有尺寸都有效

现在我们把width修改成500，height修改成250变成下面这样

7.空白折叠

发生在行盒（行块盒）内部或行盒（行块盒）之间

8.可替换元素与非可替换元素

大部分元素，页面上显示的结果取决于元素内容，成为非可替换元素

少部分元素，页面上显示的结果取决于元素属性，成为可替换元素

可替换元素：img，video，audio
绝大部分为行盒，可替换元素类似于行块盒，所有尺寸都有效，border也是占据尺寸的（物理碰撞）

object-fit属性：填fill是将图片在边框内铺满
contain是按照图片大小进行等比例缩小放大，
cover和contain差不多，但一定会铺满边框，进行了等比例放大

可以看出一部分信息丢失了