【问题标题】:Firefox Developer Edition ~ CSS Unique Selector?Firefox 开发者版 ~ CSS 唯一选择器?
【发布时间】:2017-03-13 14:32:34
【问题描述】:

在“普通”Firefox 上的 FireBug 中,打开 FireBug 控制台后,您可以右键单击一个元素并“复制 CSS 路径”。

我过去一直使用这个来获得独特的 CSS 选择器来编写我的 CSS。

此选项在 FireFox 开发者版(集成 FireBug)中不可用,那么还有其他方法可以将此信息添加到我的剪贴板吗?

编辑:
我知道有一个右键单击 > 复制 > Css 选择器,但这给了我:

#widget-column-16 > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > p:nth-child(1)

当我想要的是: #widget-column-16 .div-name .div-name .div-name .div-name p

【问题讨论】:

    标签: css firefox firefox-developer-tools


    【解决方案1】:

    我也想念“复制 CSS 路径”,我希望 Firefox 开发者工具将它作为他们工具集的一个选项引入。

    这是一个很棒的工具,我仍在尝试找出如何替换它。

    到目前为止,我发现的唯一解决方法是使用 Google Chrome 的 Inspect。它提供了一个右键单击 > 复制 > 复制 Xpath 选项。

    复制 Xpath 不会像“复制 CSS 路径”那样创建一个漂亮、干净的 CSS 路径,因此您必须进行一些编辑以删除斜线并稍微整理一下。

    它也不包括类或标识符,这很糟糕。

    但至少它为您提供了一种快速复制以“html body div”等开头的整个路径的方法。

    【讨论】:

      【解决方案2】:

      右键单击元素 -> 复制 -> css-selector

      你在找这个吗?

      【讨论】:

      • 不,我有那个,但是这给了我,例如:#widget-column-16 > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > p:nth-child(1) 当我想要的是:#widget-column-16 .div-name .div-name .div-name .div-name p
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-09-22
      • 2017-05-21
      • 1970-01-01
      • 2019-07-12
      • 2019-11-12
      • 2021-02-06
      • 2016-05-01
      相关资源
      最近更新 更多