提交 d72391ab 编写于 作者: D David Storey

Add descriptions to CSS Grid properties

上级 4d46ba16
......@@ -2755,48 +2755,82 @@
<entry name="grid-area" restriction="identifier, integer" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-area" syntax="div { $(name): span 3; }">
<desc>Determine a grid item’s size and location within the grid by contributing a line, a span, or nothing (automatic) to its grid placement. Shorthand for 'grid-row-start', 'grid-column-start', 'grid-row-end', and 'grid-column-end'.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>
</values>
</entry>
<entry name="grid-auto-columns" restriction="length, percentage" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-auto-columns" syntax="div { $(name): 100px; }">
<desc>Specifies the size of implicitly created columns.</desc>
<values>
<value name="min-content" version="3.0" browsers="all" />
<value name="max-content" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all" />
<value name="minmax()" version="3.0" browsers="all" />
<value name="min-content" version="3.0" browsers="all">
<desc>Represents the largest min-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="max-content" version="3.0" browsers="all">
<desc>Represents the largest max-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="auto" version="3.0" browsers="all">
<desc>As a maximum, identical to 'max-content'. As a minimum, represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.</desc>
</value>
<value name="minmax()" version="3.0" browsers="all">
<desc>Defines a size range greater than or equal to min and less than or equal to max.</desc>
</value>
</values>
</entry>
<entry name="grid-auto-flow" restriction="enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-auto-flow" syntax="div { $(name): column; }">
<desc>Controls how the auto-placement algorithm works, specifying exactly how auto-placed items get flowed into the grid.</desc>
<values>
<value name="row" version="3.0" browsers="all" />
<value name="column" version="3.0" browsers="all" />
<value name="dense" version="3.0" browsers="all" />
<value name="row" version="3.0" browsers="all">
<desc>The auto-placement algorithm places items by filling each row in turn, adding new rows as necessary.</desc>
</value>
<value name="column" version="3.0" browsers="all">
<desc>The auto-placement algorithm places items by filling each column in turn, adding new columns as necessary.</desc>
</value>
<value name="dense" version="3.0" browsers="all">
<desc>If specified, the auto-placement algorithm uses a “dense” packing algorithm, which attempts to fill in holes earlier in the grid if smaller items come up later.</desc>
</value>
</values>
</entry>
<entry name="grid-auto-rows" restriction="length, percentage" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-auto-rows" syntax="div { $(name): 100px; }">
<desc>Specifies the size of implicitly created rows.</desc>
<values>
<value name="min-content" version="3.0" browsers="all" />
<value name="max-content" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all" />
<value name="minmax()" version="3.0" browsers="all" />
<value name="min-content" version="3.0" browsers="all">
<desc>Represents the largest min-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="max-content" version="3.0" browsers="all">
<desc>Represents the largest max-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="auto" version="3.0" browsers="all">
<desc>As a maximum, identical to 'max-content'. As a minimum, represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.</desc>
</value>
<value name="minmax()" version="3.0" browsers="all">
<desc>Defines a size range greater than or equal to min and less than or equal to max.</desc>
</value>
</values>
</entry>
<entry name="grid-column" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-column" syntax="#item1 { $(name): span 2 / auto; }">
<desc>Shorthand for 'grid-column-start' and 'grid-column-end'.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>
</values>
</entry>
<entry name="grid-column-end" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-column-end" syntax="#item1 { $(name): span 2; }">
<desc>Determine a grid item’s size and location within the grid by contributing a line, a span, or nothing (automatic) to its grid placement.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>
</values>
</entry>
<entry name="grid-column-gap" restriction="length" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-column-gap" syntax="#item1 { $(name): 2em; }">
......@@ -2805,8 +2839,12 @@
<entry name="grid-column-start" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-column-start" syntax="#item1 { $(name): span 2; }">
<desc>Determine a grid item’s size and location within the grid by contributing a line, a span, or nothing (automatic) to its grid placement.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>/>
</values>
</entry>
<entry name="grid-gap" restriction="length" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-gap" syntax="#item1 { $(name): 2em 1em; }">
......@@ -2815,15 +2853,23 @@
<entry name="grid-row" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-row" syntax="#item1 { $(name): span 2 / auto; }">
<desc>Shorthand for 'grid-row-start' and 'grid-row-end'.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>>
</values>
</entry>
<entry name="grid-row-end" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-row-end" syntax="#item1 { $(name): span 2; }">
<desc>Determine a grid item’s size and location within the grid by contributing a line, a span, or nothing (automatic) to its grid placement.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>
</values>
</entry>
<entry name="grid-row-gap" restriction="length" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-row-gap" syntax="#item1 { $(name): 2em; }">
......@@ -2832,50 +2878,98 @@
<entry name="grid-row-start" restriction="identifier, integer, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-row-start" syntax="#item1 { $(name): span 2; }">
<desc>Determine a grid item’s size and location within the grid by contributing a line, a span, or nothing (automatic) to its grid placement.</desc>
<values>
<value name="auto" version="3.0" browsers="all" />
<value name="span" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all">
<desc>The property contributes nothing to the grid item’s placement, indicating auto-placement, an automatic span, or a default span of one.</desc>
</value>
<value name="span" version="3.0" browsers="all">
<desc>Contributes a grid span to the grid item’s placement such that the corresponding edge of the grid item’s grid area is N lines from its opposite edge.</desc>
</value>
</values>
</entry>
<entry name="grid-template" restriction="identifier, length, percentage, string, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-template" syntax="#item1 { $(name): auto 1fr auto / auto 1fr; }">
<desc>Shorthand for setting grid-template-columns, grid-template-rows, and grid-template-areas in a single declaration.</desc>
<values>
<value name="none" version="3.0" browsers="all" />
<value name="min-content" version="3.0" browsers="all" />
<value name="max-content" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all" />
<value name="subgrid" version="3.0" browsers="all" />
<value name="minmax()" version="3.0" browsers="all" />
<value name="repeat()" version="3.0" browsers="all" />
<value name="none" version="3.0" browsers="all">
<desc>Sets all three properties to their initial values.</desc>
</value>
<value name="min-content" version="3.0" browsers="all">
<desc>Represents the largest min-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="max-content" version="3.0" browsers="all">
<desc>Represents the largest max-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="auto" version="3.0" browsers="all">
<desc>As a maximum, identical to 'max-content'. As a minimum, represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.</desc>
</value>
<value name="subgrid" version="3.0" browsers="all">
<desc>Sets 'grid-template-rows' and 'grid-template-columns' to 'subgrid', and 'grid-template-areas' to its initial value.</desc>
</value>
<value name="minmax()" version="3.0" browsers="all">
<desc>Defines a size range greater than or equal to min and less than or equal to max.</desc>
</value>
<value name="repeat()" version="3.0" browsers="all">
<desc>Represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form.</desc>
</value>
</values>
</entry>
<entry name="grid-template-areas" restriction="string" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-template-areas" syntax="#item1 { $(name): 'head head' 'nav main' 'foot foot'; }">
<desc>Specifies named grid areas, which are not associated with any particular grid item, but can be referenced from the grid-placement properties.</desc>
<values>
<value name="none" version="3.0" browsers="all" />
<value name="none" version="3.0" browsers="all">
<desc>The grid container doesn’t define any named grid areas.</desc>
</value>
</values>
</entry>
<entry name="grid-template-columns" restriction="identifier, length, percentage, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-template-columns" syntax="#item1 { $(name): 100px 1fr max-content minmax(min-content, 1fr); }">
<desc>specifies, as a space-separated track list, the line names and track sizing functions of the grid.</desc>
<values>
<value name="none" version="3.0" browsers="all" />
<value name="min-content" version="3.0" browsers="all" />
<value name="max-content" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all" />
<value name="subgrid" version="3.0" browsers="all" />
<value name="minmax()" version="3.0" browsers="all" />
<value name="repeat()" version="3.0" browsers="all" />
<value name="none" version="3.0" browsers="all">
<desc>There is no explicit grid; any rows/columns will be implicitly generated.</desc>
</value>
<value name="min-content" version="3.0" browsers="all">
<desc>Represents the largest min-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="max-content" version="3.0" browsers="all">
<desc>Represents the largest max-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="auto" version="3.0" browsers="all">
<desc>As a maximum, identical to 'max-content'. As a minimum, represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.</desc>
</value>
<value name="subgrid" version="3.0" browsers="all">
<desc>Indicates that the grid will align to its parent grid in that axis.</desc>
</value>
<value name="minmax()" version="3.0" browsers="all">
<desc>Defines a size range greater than or equal to min and less than or equal to max.</desc>
</value>
<value name="repeat()" version="3.0" browsers="all">
<desc>Represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form.</desc>
</value>
</values>
</entry>
<entry name="grid-template-rows" restriction="identifier, length, percentage, string, enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css-grid-1/#propdef-grid-template-rows" syntax="#item1 { $(name): 100px 1fr max-content minmax(min-content, 1fr); }">
<desc>specifies, as a space-separated track list, the line names and track sizing functions of the grid.</desc>
<values>
<value name="none" version="3.0" browsers="all" />
<value name="min-content" version="3.0" browsers="all" />
<value name="max-content" version="3.0" browsers="all" />
<value name="auto" version="3.0" browsers="all" />
<value name="subgrid" version="3.0" browsers="all" />
<value name="minmax()" version="3.0" browsers="all" />
<value name="repeat()" version="3.0" browsers="all" />
<value name="none" version="3.0" browsers="all">
<desc>There is no explicit grid; any rows/columns will be implicitly generated.</desc>
</value>
<value name="min-content" version="3.0" browsers="all">
<desc>Represents the largest min-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="max-content" version="3.0" browsers="all">
<desc>Represents the largest max-content contribution of the grid items occupying the grid track.</desc>
</value>
<value name="auto" version="3.0" browsers="all">
<desc>As a maximum, identical to 'max-content'. As a minimum, represents the largest minimum size (as specified by min-width/min-height) of the grid items occupying the grid track.</desc>
</value>
<value name="subgrid" version="3.0" browsers="all">
<desc>Indicates that the grid will align to its parent grid in that axis.</desc>
</value>
<value name="minmax()" version="3.0" browsers="all">
<desc>Defines a size range greater than or equal to min and less than or equal to max.</desc>
</value>
<value name="repeat()" version="3.0" browsers="all">
<desc>Represents a repeated fragment of the track list, allowing a large number of columns or rows that exhibit a recurring pattern to be written in a more compact form.</desc>
</value>
</values>
</entry>
<entry name="hanging-punctuation" restriction="enum" version="3.0" browsers="none" ref="http://www.w3.org/TR/css3-text/#hanging-punctuation0" syntax="p { $(name): first; }">
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册