input输入框是否支持after、before伪类？

Question

需求：输入框内部有搜索的图标
我的想法：把图标作为input的伪类，定位到输入框内
实际操作结果：审查元素时有::after，但页面上不显示

疑问：
1、在查阅资料过程中，不同文章观点不一，input是否支持after、before？如果不支持，原因是什么？
2、不同类型的input是不是对after、before支持程度不一样？当type="checkbox"时，chrome显示伪类，firefox不显示，这又是为什么？
3、有的文章指出，自身闭合的元素不支持after、before，这种说法是否正确？

Answer 1

1.严格意义上说, input不支持伪元素. 原因是https://developer.mozilla.org...

1. 涉及到浏览器兼容性的问题, 没家浏览器的渲染机制都不一样. 这种例子很多. chrome可以, firefox不行, 或者edge不行. input不支持伪元素, 请参照以上地址的文档.
2. 不准确, 了解下替换元素 replaced elements 吧

Answer 2

作为DOM元素，伪元素都是在容器内进行渲染的。input无法容纳其他元素，因此它不支持伪元素。
要通过before、after加额外样式时，就得先套个div试试。