@@ -12,7 +12,11 @@ Editor: Rossen Atanassov, rossen.atanassov@microsoft.com
12
12
Editor : Shane Stephens, shanestephens@google.com
13
13
</pre>
14
14
15
- <h2>Introduction</h2>
15
+ <pre class='link-defaults'>
16
+ spec:dom-core-ls; type:interface; text:Document
17
+ </pre>
18
+
19
+ <h2 id='intro'>Introduction</h2>
16
20
17
21
The layout stage of CSS is responsible for generating the position and size of
18
22
a document's content. During this process, each DOM element produces
@@ -22,7 +26,7 @@ fragments.
22
26
This specification describes an API that gives developers access to geometry,
23
27
text and other information about boxes and fragments.
24
28
25
- <h2>Boxes and Fragments</h2>
29
+ <h2 id='boxes-and-fragments' >Boxes and Fragments</h2>
26
30
27
31
The [[!css-display-3]] specification describes the relationship between
28
32
elements, boxes, and fragments.
@@ -34,63 +38,63 @@ Fragments do not in general form a tree that maps cleanly back to the DOM. When
34
38
an element generates multiple fragment trees, the element that generates a least common ancestor can be arbitrarily far up the DOM tree.
35
39
36
40
<div class='example'>
37
- Assuming that layout places "foo bar" on the first line, and "baz" on the
38
- second, the following HTML produces six fragments in a single tree.
39
- <pre class=lang-markup>
40
- <style>
41
- p::first-line { color: green; }
42
-
43
- p::first-letter { color: red; }
44
- </style>
45
- <p>foo <i>bar baz</i></p>
46
- </pre>
47
- The fragments are:
48
- * the first line box
49
- * the second line box
50
- * the first letter fragment, parented by the first line box and styled by the first-letter rule.
51
- * a fragment containing "oo", parented by the first line box and styled by the first-line rule.
52
- * a fragment containing "bar", parented by the first line box and italic.
53
- * a fragment containing "baz", parented by the second line box and italic.
54
-
55
- The italic element produces two fragments ("bar" and "baz"), each in its own
56
- tree. In this example, the paragraph element generates the common root for
57
- these fragments; however if (for example) the paragraph element were itself a
58
- descendant of a multi-column div then the common root may be further up the
59
- tree.
60
-
41
+ Assuming that layout places "foo bar" on the first line, and "baz" on the
42
+ second, the following HTML produces six fragments in a single tree.
43
+
44
+ <pre class=lang-markup>
45
+ <style>
46
+ p::first-line { color: green; }
47
+
48
+ p::first-letter { color: red; }
49
+ </style>
50
+ <p>foo <i>bar baz</i></p>
51
+ </pre>
52
+
53
+ The fragments are:
54
+
55
+ * the first line box
56
+ * the second line box
57
+ * the first letter fragment, parented by the first line box and styled by the first-letter rule.
58
+ * a fragment containing "oo", parented by the first line box and styled by the first-line rule.
59
+ * a fragment containing "bar", parented by the first line box and italic.
60
+ * a fragment containing "baz", parented by the second line box and italic.
61
+
62
+ The italic element produces two fragments ("bar" and "baz"), each in its own
63
+ tree. In this example, the paragraph element generates the common root for
64
+ these fragments; however if (for example) the paragraph element were itself a
65
+ descendant of a multi-column div then the common root may be further up the
66
+ tree.
61
67
</div>
62
68
63
69
Boxes are not explicitly exposed by this API.
64
70
65
- <h2>API</h2>
71
+ <h2 id='api' >API</h2>
66
72
67
73
<pre class='idl'>
68
-
69
74
interface DeadFragmentInformation {
70
- readonly attribute Node node;
71
- readonly attribute double width;
72
- readonly attribute double height;
73
- readonly attribute double top;
74
- readonly attribute double left;
75
- readonly attribute boolean isOverflowed;
76
- readonly attribute sequence<DeadFragmentInformation> ? children;
77
- readonly attribute DeadFragmentInformation? nextSibling;
78
- readonly attribute DeadFragmentInformation? previousSibling;
79
- readonly attribute DeadFragmentInformation? nextInBox;
80
- readonly attribute DeadFragmentInformation? previousInBox;
75
+ readonly attribute Node node;
76
+ readonly attribute double width;
77
+ readonly attribute double height;
78
+ readonly attribute double top;
79
+ readonly attribute double left;
80
+ readonly attribute boolean isOverflowed;
81
+ readonly attribute sequence<DeadFragmentInformation> ? children;
82
+ readonly attribute DeadFragmentInformation? nextSibling;
83
+ readonly attribute DeadFragmentInformation? previousSibling;
84
+ readonly attribute DeadFragmentInformation? nextInBox;
85
+ readonly attribute DeadFragmentInformation? previousInBox;
81
86
};
82
87
83
88
enum FragmentFilter {
84
- "direct-fragments-only",
85
- "fragment-hierarchy"
89
+ "direct-fragments-only",
90
+ "fragment-hierarchy"
86
91
};
87
92
88
93
partial interface Element {
89
- Promise<DeadFragmentInformation> getFragmentInformation(FragmentFilter filter);
94
+ Promise<DeadFragmentInformation> getFragmentInformation(FragmentFilter filter);
90
95
};
91
96
92
97
partial interface Document {
93
- void layoutNow();
98
+ void layoutNow();
94
99
};
95
-
96
100
</pre>
0 commit comments