diff --git a/source b/source index 17ac4d82005..ea919cb2f50 100644 --- a/source +++ b/source @@ -15999,6 +15999,88 @@ interface HTMLLinkElement : HTMLElement { and process, e.g., because it is waiting for the resource to be needed, do not delay the load event.)
+link
element and a style
elementAll internal resource
+ links with the rel
attribute containing the keyword
+ stylesheet
have a
+ share the local style resource algorithm, which takes a link
element
+ el.
+
+
The share the local style resource, given a link
element
+ el, is as follows:
Let doc be el's node document.
Let indicatedElement be the result of selecting the indicated part given doc + and url.
If all of the following are true:
+ +el creates an internal resource link;
el is browsing-context connected;
el's rel
attribute
+ contains stylesheet
;
el's media
attribute
+ matches the environment; and
indicatedElement is a style
element
+ whose associated Document
is doc,
indicatedElement is browsing-context connected;
indicatedElement has an associated CSS style sheet that + does not have its + disabled flagset;
then share the CSS style sheet from indicatedElement with + el.
+Whenever a shared stylesheet link
element el
+ becomes browsing-context disconnected, or el's
+ href attribute's value is changed remove the CSS style sheet in question.
In the following example, the page has been made yellow-on-blue using CSS. Without the
+ link
tag, the content within the template
would not have
+ yellow-on-blue text.
<!DOCTYPE html>
+<html lang="en">
+<head>
+ <title>Style sharing sample page</title>
+ <style id="shared-styles">
+ * { background: navy; color: yellow; }
+ </style>
+</head>
+<body>
+ <h1>Sample styled content outside shadow</h1>
+ <div>
+ <template shadowrootmode="open">
+ <link rel="stylesheet" href="#shared-styles">
+ <h1>Sample styled content inside shadow</h1>
+ </template>
+ </div>
+</body>
+</html>
+ Note that the shared styles are a live reference, so updates to the style rules
+ in the referenced style
element will be reflected in the referenced
+ link
's CSS stylesheet.
Link
` headersAll link types that can be external resource
@@ -26347,7 +26429,10 @@ document.body.appendChild(wbr);
The The specified resource is a CSS style sheet that describes how to present the
- document. The specified resource is a CSS style sheet for external resource links or an internal resource link to a If the
- stylesheet
External Resource
+
+ External Resource or
+ Internal Resource
+
not allowed
Yes
·
@@ -27999,12 +28084,14 @@ document.body.appendChild(wbr);
data-x="rel-stylesheet">stylesheet"
stylesheet
keyword may be used with link
- elements. This keyword creates an external resource
- link that contributes to the styling processing model. This keyword is
- body-ok.style
element
+ that describes how to present the document.alternate
keyword is also specified on the
link
element, then the link is an
@@ -147649,6 +147736,7 @@ INSERT INTERFACES HERE
Kristof Zelechovski,
Krzysztof Maczyński,
黒澤剛志 (Kurosawa Takeshi),
+ Kurt Catti-Schmidt,
Kyle Barnhart,
Kyle Hofmann,
Kyle Huey,