请问什么是可替换元素和非可替换元素，它们的差异是什么？并举例说明。
前端面试中HTML的题目本来就最少，而且并不难，翻来覆去也就那几样。我们之前已经谈到过最经典的HTML语义化，今天就借此机会来谈谈可替换元素。
释义
什么是可替换元素？顾名思义，就是会被替换的元素。（尬笑……
比如一个典型的可替换元素img：
<imgsrc=xxx.jpg>
我们并没有在img标签中写入任何内容，那它的内容从哪里来的呢？
是浏览器去下载src属性给到的图片，并用该图片资源替换掉img标签，而且浏览器在下载前并不知道图片的宽高。所以，可替换元素比较特殊，它的宽高是由其加载的内容决定的。（当然CSS可以覆盖其样式）
示例
还是用img标签举几个例子：
<imgsrc="https://avatars2.githubusercontent.com/u/17703242?s=460&v=4">
该图片在页面中展现出来的话，就是图片本身本身的宽高。
img元素也支持width和height属性：
<imgwidth="80"height="80"src="https://avatars2.githubusercontent.com/u/17703242?s=460&v=4">
此时该元素展现出来就是宽高为80像素。
如果我们再用CSS去覆盖其样式：
img{
60px;
height:60px;
}
该元素的展现即为60像素。
MDN的释义
看过上面的例子之后我们再来理解概念性的知识就比较容易了。
可替换元素（replacedelement）的展现效果不是由CSS来控制的。这些元素是一种外部对象，它们外观的渲染，是独立于CSS的。
简单来说，它们的内容不受当前文档的样式的影响。CSS可以影响可替换元素的位置，但不会影响到可替换元素自身的内容。
典型的可替换元素有<iframe><video><embed><img>，还有一些元素仅在特定情况下被作为可替换元素处理，比如<input>。
本文转载自中文网
本文转载自中文网
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h55810.shtml