Index: pages/filters.html |
=================================================================== |
--- a/pages/filters.html |
+++ b/pages/filters.html |
@@ -247,16 +247,19 @@ |
{{ abp-properties-1 <code><fix>:-abp-properties(properties)</fix></code> will select elements based upon stylesheet properties. For example <code><fix>:-abp-properties(width:300px;height:250px;)</fix></code> will select elements that have a corresponding CSS rule in a stylesheet which sets the <code><fix>width</fix></code> and <code><fix>height</fix></code> to the values <code><fix>300px</fix></code> and <code><fix>250px</fix></code> respectively. Property names are matched case-insensitively. Furthermore, wildcards can be used so that <code><fix>:-abp-properties(width:*px;height:250px;)</fix></code> will match any width specified in pixels and a height of 250 pixels. }} |
</p> |
<p> |
{{ abp-properties-2 You can also use <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">regular expressions</a> by surrounding the properties expression with "/". For example, <code><fix>:-abp-properties(/width:30[2-8]px;height:250px;/)</fix></code> will match widths between 302 and 308 pixels and a height of 250 pixels. }} |
</p> |
<p> |
{{ abp-properties-3 <em>Note</em>: The <a href="https://adblockplus.org/development-builds/new-css-property-filter-syntax">older syntax</a> for the CSS property filters is deprecated and will be automatically converted to the new format . The syntax to select the style properties remain the same. For example, <code><fix>[-abp-properties='width:300px;height:250px;']</fix></code> will be converted to <code><fix>:-abp-properties(width:300px;height:250px;)</fix></code>. }} |
</p> |
+<p> |
+ {{ abp-properties-4 <code><fix>:-abp-properties()</fix></code> will also select elements using the style properties found in their pseudo-elements, like <code><fix>::before</fix></code> and <code><fix>::after</fix></code>. For example, <code><fix>:-abp-properties(content:'Advertisment')</fix></code> will match elements where the string <em>Advertisment</em> is found in either their <code><fix>::before</fix></code> or <code><fix>::after</fix></code> pseudo element. }} |
+</p> |
<h4>:-abp-has()</h4> |
<p> |
{{ abp-has-1 <code><fix>:-abp-has(selector)</fix></code> will select elements based on their content. For example <code><fix>:-abp-has(> div > a.advertiser)</fix></code> will select elements that contain as a direct descendant a <code><fix><div></fix></code> that contains an <code><fix><a></fix></code> with the class <code><fix>advertiser</fix></code>. The inner selector can be relative to the element scope, and can use any of the pseudo-selectors, including <code><fix>:-abp-has()</fix></code> and will determine whether the selection will occur. }} |
</p> |
<h4>:-abp-contains()</h4> |
<p> |
{{ abp-contains-1 <code><fix>:-abp-contains(text)</fix></code> will select elements based on their text content. For example, <code><fix>div.sidebar > span:-abp-contains(Advertisment)</fix></code> will select the <code><fix><span></fix></code> elements within a <code><fix><div></fix></code>, with a class of <code><fix>sidebar</fix></code> that contains the word "Advertisment". In practice, you'd want to combine this with a <code><fix>:-abp-has()</fix></code> to select the outer container — something like <code><fix>div.sidebar > div:-abp-has(span:-abp-contains(Advertisment))</fix></code> to select the container that would contain an advertisement label. }} |
</p> |