如何在 chrome devtools 中检查 webkit 元素样式？

Question

我有<input type="file"我的网页上。我想在 chrome 开发工具中查看文件的按钮样式。不幸的是，如果我使用这个元素，它会显示元素整个输入的样式（我的意思是文本 + 按钮）。我想检查样式::-webkit-file-upload-button. 例如，Firefox显示选择元素时的所有样式。有什么办法可以在 chrome 中做到这一点吗？

下面的图片代表一个例子。很明显，图像中的按钮使用 进行了样式设置::-webkit-file-upload-button，但样式列表中没有background-color/ bacgrkound-image。如何查看 webkit-element 的样式？

Answer 1

正如@wOxxOm 回答的那样，我应该Shadow DOM在 devtool 设置中启用。