Javascript 如何从chrome开发工具中获得确切的.css目标？

我使用Chrome开发工具探索我网页上元素的大小。我们使用的是来自的pdf查看器插件，我想强制元素大小为500x500 px。我可以在chrometools中找到元素并手动调整那里的样式，如下所示

我现在想更新

app.css

，使其始终为500x500px。如您所见，元素是嵌套的（即

文件预览帧->kv文件内容->kv预览数据

）。所以我不知道如何针对.css实现这个目标有没有办法从chrome工具获取此元素的.css路径？换句话说，我可以将chrometools中的内容复制粘贴到我的.css文件中，以正确设置此元素（或此元素类）

PS：我猜这是类似于

myviewer.file preview frame.kv file content.kv preview data

的东西，但是有没有一种方法可以复制它而不必猜测一百万种可能性？对不起，我不擅长css

更新 根据评论/答案，建议右键单击并复制选择器。通过这样做，我得到了以下几点：

#preview-1600093158823_90-0 > div.kv-file-content > embed

这里有两个问题。首先，id（16000…）在每次页面加载时都会更改。我猜插件没有正确识别这个嵌入。第二，这个复制的选择器可以直接放到

app.css

文件中吗？它是有效的.css还是只有有效的jQuery，我必须从javascript/jQuery访问它

如何繁殖 转到，选择与第一个演示中的acrobat.pdf文件对应的元素，然后选择“嵌入”

---

您可以右键单击开发工具中的元素，然后复制css选择器

然后，您可以将其直接粘贴到css文件中，并将样式放在花括号之后

很可能您不需要完整的选择器，因为这会提供给您，但有时只要一个id就足够了。通常（尤其是js中的css），元素的类名并不一致，但在页面呈现之间会发生变化

---

更新 如果开发工具的css目标不够好（如更新问题中给出的特定网站），那么您可以使用数据属性来选择元素，因此：

div[data-template="pdf"] > div.kv-file-content > embed

---

在开发工具中：右键单击元素，复制>复制Selector@ajmnz你能看到我更新的答案吗？它可以用在你的css文件中，但正如下面的答案所说，你可能不需要完整的选择器。假设ID在页面加载时发生了更改，

div.kv-file-content>embed

。但是我必须参考它来自的图书馆吗？例如

.krajee default.file preview frame.kv file content

？您是否有可能尝试修改iframe中的元素？你能分享一个网站链接或JSFIDLE吗？你能看到我更新的答案并进一步推荐吗？谢谢你的更新与原来的问题没有多大关系，因为如果chrome工具提供的选择器不能满足你的需要，你需要编写一个手动选择器。