【原文1：https://www.cnblogs.com/annie211/p/5933522.html】
【原文2：https://blog.csdn.net/qq_35765126/article/details/89047755】
问题：img、input到底是行内还是块级元素？
为什么有的行内元素可以撑开父元素，有的不可以呢，行内元素设置padding、margin到底会不会生效呢？
替换元素 不可替换元素 行内替换元素 行内不可替换元素的学习
学习总结：
1.img input属于行内替换元素，height/width/padding/margin均可用，效果等同于块元素
行内非替换元素的height / width / padding-top / padding-bottom / margin-top / margin-bottom 均无效果，只能用padding-left / padding-right / margin-left / margin-right 改变宽度
2.在文档类型定义（DTD）中对不同的元素规定了不同的类型，这也是DTD对文档之所以重要的原因之一。
从元素本身的特点来讲，可以分为不可替换元素和替换元素
1.不可替换元素：
(X)HTML的大多数元素是不可替换元素，及其内容直接表现给用户端（例如浏览器）。
如： <h1>我是标题<h1>
2.替换元素：
替换元素就是浏览器根据元素的标签和属性，来决定元素的具体显示内容。
例如浏览器会根据<img>标签的src属性的值来读取图片信息并显示出来，而如果查看(X)HTML代码，则看不到图片的实际内容
又如根据<input>标签的type属性来决定是显示输入框，还是单选按钮等
(X)HTML中的img input textarea select object 都是替换元素，这些元素没有实际的内容 即是一个空元素
替换元素一般有内在尺寸，所以具有width和height， 可以设定。例如你不指定img的width和height时，就按其内在尺寸显示，也就是图片被保存时候的宽度和高度。
对于表单元素，浏览器也有默认的样式，包括宽度和高度。
3.行内替换元素设置padding margin 可以撑开父元素，行内非替换元素设置padding（四个方向）、margin-left、margin-right也生效，但是不会撑开父元素
