HTML and CSS Reference
In-Depth Information
There are a very few special circumstances where even an element's start tag can be omitted and the
entire element is merely implied. In the case of these
implied elements
, the element still “exists” within the
rendered page because browsers will generate it automatically, but its start and end tags are optional in
the markup. For instance, the
tbody
element defines the body of a table in HTML, and its start tag is often
optional because the beginning and ending of the table body is implied by the other elements around it.
You'll learn about HTML tables in Chapter 7.
Attributes
An element's start tag can carry
attributes
to provide more information about the element—specific traits or
properties that element should possess. An attribute consists of an
attribute name
followed by an
attribute
value
, like so:
<p
class="greeting"
>Hello, world!</p>
This paragraph includes a
class
attribute with a value of “greeting,” making it distinct from other
paragraphs that don't include that attribute (you'll learn more about the
class
attribute later). An attribute's
name and its value are connected by an equal sign (
=
) with no spaces allowed between;
class =
"
greeting
" isn't valid.
The quotation marks enclosing the value are optional in HTML5, but are required in XHTML. In HTML5,
the attributes
class=greeting
and
class="greeting"
are equally valid so the choice is yours. When
you do choose to quote attribute values, you can use either single quotes (
'...'
) or double quotes
(
"..."
) so long as both of them match; quoting a value like
"...'
wouldn't be valid. Some attributes may
possess multiple values separated by spaces, or a value composed of several words with spaces
between, and in those cases the entire value or set of values must be enclosed in quotation marks.
Some attributes don't require a value at all and the very presence of the attribute provides all the
information a user-agent needs. An attribute without a value is called a
minimized attribute
. For example,
here's the markup for a pre-checked checkbox, with the
checked
attribute in its minimized form
(highlighted in bold):
<input type="checkbox"
checked
>
This is also called a
Boolean attribute
, named after the 19
th
Century mathematician George Boole, who
devised a system of logic based on true and false values represented by the digits 1 (true) and 0 (false).
Boolean logic is the foundation for much of computer science; a bit in binary is either 1 or 0, a switch is
either on or it's off. There's no need for any other value for the
checked
attribute because a checkbox is
either checked or not checked; the attribute's mere presence indicates “true.” XHTML's strictness requires
values for
all
attributes and doesn't allow minimizing attributes, not even Boolean ones. Thus, the same
checkbox would appear in XHTML with a non-minimized
checked
attribute:
<input type="checkbox"
checked="checked"
/>
It seems redundant, and it is, but it's just part of XHTML's strictness. XML requires values for
all
attributes,
so XHTML requires them too. HTML5 doesn't require values for Boolean attributes, but nor does it forbid
them. Some newer Boolean attributes introduced in HTML5 accept
true
and
false
values rather than
repeating the attribute name XHTML-style. Also note the trailing slash in the example above, because
