HTML and CSS Reference
In-Depth Information
Unit
Description
Examples
Relative
Lengths
Although relative lengths are often
misunderstood, they are quite useful as
they can be used to scale layouts to handle
very different viewing situations. An
em
unit is related to the
font-size
of a
particular font being measured. Very often,
this unit is used relative to the
font-size
of its inheriting parent. An
ex
value is
called the x-height and is used to measure
the height of font as defined by the size
of its lowercase x character. A
ch
value
introduced by CSS3 is another font-related
length, which is equivalent to the width
of the character
0
(zero) in the current
font and has started to be supported in
some browsers. Surprising to some Web
developers, a pixel (
px
) is also a relative
unit, as there may be different pixel
densities on different screens.
p.lead {text-indent:
0.5em;}
.bigger {font-size: 3ex;}
#moreThanZero
{font-size: 10ch;}
#box {height: 100px;
width: 100px;}
Strings
Strings are defined with either single
quotes ('example') or double quotes
(“example”). Quotes may be found within
the opposite quote (“I say this is an
'example'!”). Newlines may be specified
with a “\00000a” value. In situations
where a newline is typed, a \ character can
be used as line continuation.
p {
font-family: "Fancy Font";}
a[title="Next\
Line here"] {color: red;}
URL
Uniform Resource Identifiers generally
limited to the commonly known Uniform
Resource Location (URL) are designated
using the function style
url(
address
)
,
where address is an absolute or relative URL.
body {
background: url(stars
.png);}
T
ABLE
4-11
CSS Units and Lengths (continued)
N
OTE
There are other values found in CSS3 such as viewport sizes (
vh
,
vw
,
vm
), root relative
sizing (
rem
), and grid measurements (
gd
). Aural CSS such as angles [degrees (
deg
), grads
(
grad
), and radians (
rad
)], times [milliseconds (
ms
) and seconds (
s
)], frequencies [Hertz (
Hz
)
and kilo Hertz (
kHz
)] are also defined. These are discussed more in the reference that follows in
the next two chapters.
However, without the context of the properties in which they are used, some of the
values may not make much sense; thus, when using them in examples and presenting
various properties in the following chapters, we will strive to use them in context.
