-
Notifications
You must be signed in to change notification settings - Fork 790
Expand file tree
/
Copy pathdeferred-for-level-5
More file actions
143 lines (114 loc) · 5.72 KB
/
deferred-for-level-5
File metadata and controls
143 lines (114 loc) · 5.72 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<h3 id="idref-combinators">
Reference combinators <code>/ref/</code></h3>
The <dfn export>reference combinator</dfn> consists of two slashes
with an intervening <a href="http://www.w3.org/TR/css3-namespace/#css-qnames">CSS qualified name</a>,
and separates two <a>compound selectors</a>,
e.g. ''A /attr/ B''.
The element represented by the first <a>compound selector</a>
explicitly references
the element represented by the second <a>compound selector</a>.
Unless the host language defines a different syntax for expressing this relationship,
this relationship is considered to exist if
the value of the specified attribute on the first element is an IDREF or an <a>ID selector</a>
referencing the second element.
Attribute matching for reference combinators follow the same rules as for <a href="http://www.w3.org/TR/css3-selectors/#attribute-selectors">attribute selectors</a>.
<div class="example">
The following example highlights an <a element>input</a> element
when its <a href="http://www.w3.org/TR/html40/interact/forms.html#h-17.9"><code><label></code></a>
is focused or hovered-over:
<pre>
label:matches(:hover, :focus) /for/ input, /* association by "for" attribute */
label:matches(:hover, :focus):not([for]) input { /* association by containment */
box-shadow: yellow 0 0 10px;
}
</pre>
</div>
<h3 id="local-pseudo">
The local link pseudo-class '':local-link''</h3>
The <dfn id='local-link-pseudo'>:local-link</dfn> pseudo-class allows authors to style
<a href="#the-any-link-pseudo">hyperlinks</a> based on the users current location within a site and to
differentiate site-internal versus site-external links.
The (non-functional) '':local-link'' pseudo-class represents an element that is
the source anchor of a hyperlink whose target's absolute URL
matches the element's own document URL.
Any fragment identifiers are stripped before matching the document's URL against the link's URL;
otherwise all portions of the URL are considered.
<div class="example">
For example, the following rule prevents links targetting the
current page from being underlined when they are part of the
navigation list:
<pre>nav :local-link { text-decoration: none; } </pre>
</div>
As a functional pseudo-class,
'':local-link()'' can also accept a non-negative integer as its sole argument,
which, if the document's URL belongs to a hierarchical scheme,
indicates the number of path levels to match:
<ul>
<li>'':local-link(0)'' represents a link element whose target is in the same origin as the document's URL
<li>'':local-link(1)'' represents a link element whose target has the same origin and first path segment
<li>'':local-link(2)'' represents a link element whose target has the same origin, first, and second path segments
<li>etc.
</ul>
<div class="example">
The following example styles all site-external links with a dashed
underline.
<pre>:not(:local-link(0)) { text-decoration-style: dashed; } </pre>
</div>
Path segments are portions of the URL's path that are separated by forward slashes (/).
If a segment is missing from the document's URL,
a pseudo-class requiring that segment to match does not match anything.
<div class="example">
So, given the links:
<ol>
<li><code><a href="http://www.example.com">Home</a></code>
<li><code><a href="http://www.example.com/2011">2011</a></code>
<li><code><a href="http://www.example.com/2011/03">March</a></code>
<li><code><a href="http://www.example.com/2011/03/">March</a></code>
<li><code><a href="http://www.example.com/2011/03/21">21 March</a></code>
<li><code><a href="https://www.example.com/2011/03/">March</a></code>
<li><code><a href="http://example.com/2011/03/">March</a></code>
</ol>
and the styles:
<ol type=A>
<li><code>a:local-link {...}</code>
<li><code>a:local-link(0) {...}</code>
<li><code>a:local-link(1) {...}</code>
<li><code>a:local-link(2) {...}</code>
<li><code>a:local-link(3) {...}</code>
<li><code>a:local-link(4) {...}</code>
</ol>
If the document's URL is <code>http://www.example.com/2011/03/</code>:
<ol>
<li>Link 1 would receive Style B
<li>Link 2 would receive Styles B and C
<li>Link 3 would receive Styles B, C, and D
<li>Link 4 would also receive Styles A, B, C, D, and E
<li>Link 5 would receive Styles B, C, and D
<li>Link 6 would remain unstyled
<li>Link 7 would remain unstyled
<li>Style F would not be applied to anything
</ol>
</div>
The "origin" of the URL is defined by <a href="http://tools.ietf.org/html/rfc6454#section-4">RFC 6454, Section 4</a>.
The username, password, query string, and fragment portions of the URL are not considered
when matching against '':local-link(<var>n</var>)''.
If the document's URL does not belong to a hierarchical scheme,
the functional pseudo-class matches nothing.
<p class="issue">
It's clear that, if the document URL has at least N segments,
then '':local-link(N)'' only matches links whose URL has at least N segments.
(This lets you assign consistent semantics to :local-link so that,
for example, :local-link(2) means a "within-repo" link on GitHub.)
What about if the document url has less than N segments,
and the link is same-page?
Should "null segments" count as matching, or not?
diff --git a/selectors/Overview.bs b/selectors/Overview.bs
--- a/selectors/Overview.bs
+++ b/selectors/Overview.bs
@@ -3175,7 +3175,7 @@ Grammar</h2>
combinator
/* combinators can be surrounded by whitespace */
- : S+ | S* [ '>' | '+' | '~' | COLUMN ] S*
+ : S+ | S* [ '>' | '+' | '~' | COLUMN | '/' IDENT '/' ] S*
;
compound_selector_list