HTML and CSS Reference
In-Depth Information
he purpose of
data
attributes is to provide extra information about the
contents of an element that can be accessed by client-side scripts. When
the HTML source code is itself generated by scripts running on a server, it
becomes a powerful tool, because it allows information in database records to
be directly incorporated into HTML elements. his was possible in earlier ver-
sions of HTML because any attribute attached to an HTML element became a
property of the DOM object representing that element. However, in HTML5,
this technique is formalized so that pages can have HTML elements contain-
ing
data
attributes and still pass syntax checkers and validation services.
A web page is given structure by the block elements that comprise it. Headings
and paragraphs in a document are block elements, as is the document body
itself. here are many diferent kinds of block elements: block quotes, lists, and
tables, to name a few. Some block elements can be nested inside other block
elements, and some cannot be. Except in very special cases, a block element
should never be inside an inline element.
Every block element occupies a rectangular area on the web page, sepa-
rated from the content before and ater by some amount of white space. he
default behavior for browsers is to give each block element as much width as
is available. Block elements that are irst-level children of the document's body
element take up the full width of the browser's window minus any padding
assigned to the body element. Block elements that are children of other block
elements are as wide as allowed by the width of their parent element.
A big change in HTML5 is the addition of several block elements for mark-
ing up new types of content. HTML3 introduced the division element,
<div></div>
, as an all-purpose container for organizing and referencing col-
lections of other document elements. he HTML5 speciication has new block
elements for speciic types of divisions, such as the
section
,
header
, and
footer
elements. hese are discussed later.
Major segments of a document are introduced and separated by headings.
HTML supports six levels of headings,
h1
through
h6
. his is suicient for
most web pages, because most of the structure of a hypertext work is in the
links that bind the pages into a website. Additional structure can be generated
by using list and table elements. All heading tags are containers and require a
corresponding end tag.
