【发布时间】：2021-01-01 06:40:42
【问题描述】：
我使用 Chrome 开发工具来探索网页上元素的大小。我们正在使用来自Krajee 的 pdf 查看器插件，我想将元素大小强制为 500x500 像素。我可以在 chrometools 中找到该元素并在那里手动调整样式，如下所示。
我现在想更新 app.css 以始终将其设为 500x500 像素。如您所见，该元素非常嵌套（即file-preview-frame -> kv-file-content -> kv-preview-data）。所以我不知道如何将其定位为.css。 有没有办法从 chrome 工具中获取此元素的 .css 路径？ 换句话说，我可以将 chrometools 中的某些内容复制粘贴到我的 .css 文件中，以正确设置此元素（或此元素类）？
PS：我猜它类似于myviewer.file-preview-frame.kv-file-content.kv-preview-data，但有没有办法复制它而不必猜测一百万种可能性？对不起，我不擅长 css。
更新
根据 cmets/answers 的建议是右键单击并复制选择器。这样做我得到以下信息：
#preview-1600093158823_90-0 > div.kv-file-content > embed
这里有两个问题。首先，每次页面加载时 id (16000...) 都会发生变化。我猜插件没有正确识别这个嵌入。其次，这个复制的选择器可以直接放到app.css文件中吗？ IE 是有效的 .css 还是仅有效的 jQuery，我必须从 javascript/jQuery 访问它？
如何复制
进入Krajee demo，选择第一个demo中acrobat.pdf文件对应的元素，选择embed。
【问题讨论】：
-
在开发工具中：右键单击元素，复制 > 复制选择器
-
@ajmnz 你能看到我更新的答案吗
-
它可以在您的 css 文件中使用，但正如下面的答案所说，您可能不需要完整的选择器。鉴于 ID 在页面加载时更改，
div.kv-file-content > embed是否有效？ -
不，这不会改变任何事情。但是我必须引用它来自的库吗？例如
.krajee-default.file-preview-frame.kv-file-content? -
您是否正在尝试修改 iframe 中的元素？你能分享一个网站链接或 Jsfiddle 吗？
标签： javascript html css angularjs google-chrome-devtools