In case
you slept through class during the previous chapters, the difference
between block and inline elements is
??? Block elements, such as paragraphs, headings, and lists, sit one
above another when displayed in the browser.
??? Inline elements, such as a, span, and img, sit side-by-side when
they are displayed in the browser and only appear on a new line
if there is insuf?¬? cient room on the previous one.
The ability to change block elements to inline elements, and vice
versa, like this
p {display:inline;}
a {display:block}
is a powerful capability that allows you, for example, to force an
inline element to ?¬? ll its containing element. We will do this with
links later when we create CSS drop-down menus.
One other value for display worth mentioning here is none. When
an element??™s display property is set to none, that element, and any
elements nested inside it, are not displayed on the page. Any space
that was occupied by the element is removed; it??™s as if the related
markup did not exist. (This contrasts with the visibility property,
which simply has the values visible or hidden. If an element??™s visibility
is set to hidden, the element is hidden, but the space it occupied
remains.) Next, you??™ll learn how to toggle the display property
of elements between none and block as the mouse moves over them
to enable functionality such as drop-down menus.
Pages:
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172