css_specyfikacja

Odnośniki

[ Pobierz całość w formacie PDF ]

table, inline-table, table-row-group, table-column, table-column-group,
table-header-group, table-footer-group, table-row, table-cell, and table-caption
These values cause an element to behave like a table element (subject to
restrictions described in the chapter on tables [p. 211] ).
Note that although the initial value [p. 73] of ’display’ is ’inline’, rules in the user
agent’s default style sheet [p. 76] may override [p. 73] this value. See the sample
style sheet [p. 261] for HTML 4.0 in the appendix.
Example(s):
Here are some examples of the ’display’ property:
p { display: block }
em { display: inline }
li { display: list-item }
img { display: none } /* Don’t display images */
9.3 Positioning schemes
In CSS 2.1, a box may be laid out according to three positioning schemes:
1. Normal flow [p. 108] . In CSS 2.1, normal flow includes block formatting [p. 109]
of block [p. 101] boxes, inline formatting [p. 109] of inline [p. 103] boxes, relative
positioning [p. 111] of block or inline boxes, and positioning of run-in [p. 103]
boxes.
2. Floats [p. 112] . In the float model, a box is first laid out according to the normal
flow, then taken out of the flow and shifted to the left or right as far as possible.
Content may flow along the side of a float.
3. Absolute positioning [p. 118] . In the absolute positioning model, a box is
removed from the normal flow entirely (it has no impact on later siblings) and
assigned a position with respect to a containing block.
Note. CSS 2.1’s positioning schemes help authors make their documents more
accessible by allowing them to avoid mark-up tricks (e.g., invisible images) used for
layout effects.
105
2 Aug 2002 21:33
Visual formatting model
9.3.1 Choosing a positioning scheme: ’position’ property
The ’position’ and ’float’ properties determine which of the CSS 2.1 positioning algo-
rithms is used to calculate the position of a box.
’position’
Value:
static | relative | absolute | fixed | inherit
Initial:
static
Applies to:
all elements, but not to generated content
Inherited:
no
Percentages: N/A
Media:
visual
The values of this property have the following meanings:
static
The box is a normal box, laid out according to the normal flow [p. 108] . The
’top’, ’right’, ’bottom’, and ’left’ properties do not apply.
relative
The box’s position is calculated according to the normal flow [p. 108] (this is
called the position in normal flow). Then the box is offset relative [p. 111] to its
normal position. When a box B is relatively positioned, the position of the follow-
ing box is calculated as though B were not offset.
absolute
The box’s position (and possibly size) is specified with the ’top’, ’right’, ’bottom’,
and ’left’ properties. These properties specify offsets with respect to the box’s
containing block [p. 100] . Absolutely positioned boxes are taken out of the
normal flow. This means they have no impact on the layout of later siblings.
Also, though absolutely positioned [p. 118] boxes have margins, they do not
collapse [p. 91] with any other margins.
fixed
The box’s position is calculated according to the ’absolute’ model, but in addi-
tion, the box is fixed [p. 119] with respect to some reference. In the case of
continuous media [p. 83] , the box is fixed with respect to the viewport [p. 100]
(and doesn’t move when scrolled). In the case of paged media [p. 83] , the box
is fixed with respect to the page, even if that page is seen through a viewport
[p. 100] (in the case of a print-preview, for example). Authors may wish to
specify ’fixed’ in a media-dependent way. For instance, an author may want a
box to remain at the top of the viewport [p. 100] on the screen, but not at the top
of each printed page. The two specifications may be separated by using an
@media rule [p. 82] , as in:
Example(s):
2 Aug 2002 21:33
106
Visual formatting model
@media screen {
h1#first { position: fixed }
}
@media print {
h1#first { position: static }
}
9.3.2 Box offsets: ’top’, ’right’, ’bottom’, ’left’
An element is said to be positioned if its ’position’ property has a value other than
’static’. Positioned elements generate positioned boxes, laid out according to four
properties:
’top’
Value:
length | percentage | auto | inherit
Initial:
auto
Applies to:
positioned elements
Inherited:
no
Percentages: refer to height of containing block
Media:
visual [ Pobierz całość w formacie PDF ]

zanotowane.pl

doc.pisz.pl

pdf.pisz.pl

angamoss.xlx.pl