WINSOME

FOLLOWING ARE CSS TAGS......

This content uploaded by:-  CHANDAN PANDEY

Background Properties

Property Description Possible Values Examples
backgroundattachment
Declares the attachment
of a background image (to
scroll with the page
content or be in a fixed
position).
fixed
scroll
div { backgrounda
ttachment:fixed; }
div { backgrounda
ttachment:scroll;
}
backgroundcolor
Declares the background
color.
Valid color names, RGB
values, hexidecimal notation.
div { backgroundc
olor:green; }
div { color:#00FF0
0; }
backgroundimage
Declares the background
image of an element.
URL values. div { backgroundi
mage:url(images/im
g.jpg); }
body { backgroundimage:
url(img.jp
g); }
backgroundposition
Declares the position of a
background image.
Lengths or percentages for the
x and y positions, or one of
the predefined values:
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
div { backgroundp
osition:10px 50px;
}
div { backgroundp
osition:bottom rig
ht; }
backgroundrepeat
Declares how and/or if a
background image repeats.
repeat
repeatx
repeaty
norepeat
div { backgroundr
epeat:repeatx;
}
div { backgroundr
epeat:norepeat;
}
background Used as a shorthand
property to set all the
background properties at
once.
Separate values by a space in
the following order (those that
are not defined will use
inherited or default initial
values):
backgroundcolor
backgroundimage
backgroundrepeat
backgroundattachment
backgroundposition
div { background:g
reen url(image.jp
g) norepeat
fixed
center center; }
div { background:u
rl(image.jpg) fixe
d; }
Border Properties
Property Description Possible Values Examples
bordertopcolor
Declares the
color of the
top border.
Valid color names, RGB values, hexidecimal notation, or the
predefined value transparent.
div { b
ordert
opcolo
r:gree
n; }
div { b
ordert
opcolo
r:#00FF
00; }
bordertopstyle
Declares the
style of the
top border.
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { b
ordert
opstyl
e:soli
d; }
div { b
ordert
opstyl
e:inse
t; }
bordertopwidth
Declares the
width of the
top border.
Lengths or the following predefined values:
thin
medium
thick
div { b
ordert
opwidt
h:2px;
}
div { b
ordert
opwidt
h:thin;
}
bordertop
Used as a
shorthand
property to
set all the
bordertop
properties at
once.
Separate values by a space in the following order (those that
are not defined will use inherited or default initial values):
bordertopwidth
bordertopstyle
bordertopcolor
div { b
ordert
op:2px
solid g
reen; }
div { b
ordert
op:thic
k doubl
e #00FF
00; }
borderrightcolor
Declares the
color of the
right border.
Valid color names, RGB values, hexidecimal notation, or the
predefined value transparent.
div { b
orderr
ightco
lor:gre
en; }
div { b
orderr
ightco
lor:#00
FF00; }
borderrightstyle
Declares the
style of the
right border.
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { b
orderr
ightst
yle:sol
id; }
div { b
orderr
ightst
yle:ins
et; }
borderrightwidth
Declares the
width of the
right border.
Lengths or the following predefined values:
thin
medium
thick
div { b
orderr
ightwi
dth:2p
x; }
div { b
orderr
ightwi
dth:thi
n; }
borderright
Used as a
shorthand
property to
set all the
borderright
properties at
once.
Separate values by a space in the following order (those that
are not defined will use inherited or default initial values):
borderrightwidth
borderrightstyle
borderrightcolor
div { b
orderr
ight:2p
x solid
green;
}
div { b
orderr
ight:th
ick dou
ble #00
FF00; }
borderbottomcolor
Declares the
color of the
bottom
border.
Valid color names, RGB values, hexidecimal notation, or the
predefined value transparent.
div { b
orderb
ottomc
olor:gr
een; }
div { b
orderb
ottomc
olor:#0
0FF00;
}
borderbottomstyle
Declares the
style of the
bottom
border.
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
div { b
orderb
ottoms
tyle:so
lid; }
div { b
orderb
ottoms
outset tyle:in
set; }
borderbottomwidth
Declares the
width of the
bottom
border.
Lengths or the following predefined values:
thin
medium
thick
div { b
orderb
ottomw
idth:2p
x; }
div { b
orderb
ottomw
idth:th
in; }
borderbottom
Used as a
shorthand
property to
set all the
borderbottom
properties at
once.
Separate values by a space in the following order (those that
are not defined will use inherited or default initial values):
borderbottomwidth
borderbottomstyle
borderbottomcolor
div { b
orderb
ottom:2
px soli
d gree
n; }
div { b
orderb
ottom:t
hick do
uble #0
0FF00;
}
borderleftcolor
Declares the
color of the
left border.
Valid color names, RGB values, hexidecimal notation, or the
predefined value transparent.
div { b
orderl
eftcol
or:gree
n; }
div { b
orderl
eftcol
or:#00F
F00; }
borderleftstyle
Declares the
style of the
left border.
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
div { b
orderl
eftsty
le:soli
d; }
div { b
orderl
eftsty
le:inse
t; }
borderleftwidth
Declares the
width of the
left border.
Lengths or the following predefined values:
thin
medium
thick
div { b
orderl
eftwid
th:2px;
}
div { b
orderl
eftwid
th:thi
n; }
borderleft
Used as a
shorthand
property to
set all the
borderleft
properties at
once.
Separate values by a space in the following order (those that
are not defined will use inherited or default initial values):
borderleftwidth
borderleftstyle
borderleftcolor
div { b
orderl
eft:2px
solid g
reen; }
div { b
orderl
eft:thi
ck doub
le #00F
F00; }
bordercolor
Declares the
border color of
all four
borders at
once.
Valid color names, RGB values, hexidecimal notation, or the
predefined value transparent.
Separate the color for each border by a space, declaring the
colors for the borders in the following order:
bordertopcolor
borderrightcolor
borderbottomcolor
borderleftcolor
Undeclared values work as further shorthand notation. If only
one color value is declared, all four borders will use that color.
If two colors are declared, the top and bottom borders will use
the first color while the right and left borders will use the
second color. If three colors are declared, the top border will
use the first color, the right and left borders will use the
second color, and the bottom border will use the third color.
div { b
orderc
olor:gr
een red
blue ol
ive; }
div { b
orderc
olor:gr
een; }
div { b
orderc
olor:gr
een re
d; }
div { b
orderc
olor:gr
een red
blue; }
borderstyle
Declares the
border style of
all four
borders at
once.
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
Undeclared values work as further shorthand notation. If only
one style value is declared, all four borders will use that style.
If two styles are declared, the top and bottom borders will use
the first style while the right and left borders will use the
second style. If three styles are declared, the top border will
use the first style, the right and left borders will use the
second style, and the bottom border will use the third style.
div { b
orders
tyle:so
lid dot
ted das
hed dou
ble; }
div { b
orders
tyle:so
lid; }
div { b
orders
tyle:so
lid dot
ted; }
div { b
orders
tyle:so
lid dot
ted das
hed; }
borderwidth
Declares the
width of all
four borders
at once.
Lengths or the following predefined values:
thin
medium
thick
Undeclared values work as further shorthand notation. If only
one width value is declared, all four borders will use that
width. If two widths are declared, the top and bottom borders
will use the first width while the right and left borders will use
the second width. If three widths are declared, the top border
will use the first width, the right and left borders will use the
second width, and the bottom border will use the third width.
div { b
orderw
idth:1p
x 3px 5
px 2px;
}
div { b
orderw
idth:th
in; }
div { b
orderw
idth:2p
x 4px;
}
div { b
orderw
idth:2p
x 4px 5
px; }
border Used as a
shorthand to
declare the
border
properties
when all four
borders will
have the
same
appearance.
Separate values by a space in the following order (those that
are not defined will use inherited or default initial values):
borderwidth
borderstyle
bordercolor
div { b
order:1
px doub
le gree
n; }
div { b
order:t
hin sol
id #00F
F00; }
Classification and Positioning Properties
Property Description Possible Values Examples
clear Declares the side(s) of an element where no
previous floating elements are allowed to be
adjacent.
left
right
both
none
div { cle
ar:right;
}
div { cle
ar:both;
}
cursor Declares the type of cursor to be displayed. URL values, and the following
prefefined values:
auto
div { cur
sor:cross
hair; }
crosshair
default
pointer
move
eresize
neresize
nwresize
nresize
seresize
swresize
sresize
wresize
text
wait
help
div { cus
rsor:ur
l(image.c
sr); }
div { cus
rsor:ur
l(image.c
sr), poin
ter; }
display Declares if/how the element displays. none
inline
block
listitem
runin
compact
marker
table
inlinetable
tablerowgroup
tableheadergroup
tablefootergroup
tablerow
tablecolumngroup
tablecolumn
tablecell
tablecaption
div { dis
play:non
e; }
div { dis
play:inli
ne; }
div { dis
play:mark
er; }
float Declares whether a box should float to the left or
right of other content, or whether it should not be
floated at all.
left
right
none
div { flo
at:left;
}
div { flo
at:right;
}
visibility Declares the visibility of boxes generated by an
element.
visible
hidden
collapse
div { vis
ibility:v
isible; }
div { vis
ibility:h
idden; }
top Declares the distance that the top content edge of
the element is offset below the top edge of its
containing block. The positionproperty of the
element must also be set to a value other
thanstatic.
Lengths, percentages, and the
predefined valueauto.
div { to
p:15px; }
div { to
p:2%; }
right Declares the distance that the right content edge
of the element is offset to the left of the right edge
of its containing block. Theposition property of
the element must also be set to a value other
than static.
Lengths, percentages, and the
predefined valueauto.
div { rig
ht:15px;
}
div { rig
ht:2%; }
bottom Declares the distance that the bottom content
edge of the element is offset above the bottom
edge of its containing block.
Theposition property of the element must also
be set to a value other than static.
Lengths, percentages, and the
predefined valueauto.
div { bot
tom:15px;
}
div { bot
tom:2%; }
left Declares the distance that the left content edge of
the element is offset to the right of the left edge of
its containing block. Theposition property of the
element must also be set to a value other
than static.
Lengths, percentages, and the
predefined valueauto.
div { lef
t:15px; }
div { lef
t:2%; }
position Declares the type of positioning of an element. static
relative
absolute
fixed
div { pos
ition:abs
olute; }
div { pos
ition:rel
ative; }
clip Declares the shape of a clipped region when the
value of theoverflow property is set to a value
other than visible.
Shapes, or the predefined
valueauto.
In CSS 2, the only valid
shape is a rectangle, using
the following format to specify
the offset lengths from each
side of the box:
rect(top, right, botto
m, left)
div { cli
p:auto; }
div { cli
p:rect(2p
x, 4px, 7
px, 5px);
}
overflow Declares how content that overflows the element's
box is handled.
visible
hidden
scroll
auto
div { ove
rflow:hid
den; }
div { ove
rflow:scr
oll; }
verticalalign
Declares the vertical alignment of an inlinelevel
element or a table cell.
Lengths, percentages, and the
following predefined values:
baseline
sub
super
top
texttop
middle
bottom
textbottom
span { ve
rticalal
ign:middl
e; }
td { vert
icalalig
n:top; }
zindex
Declares the stack order of the element. Integer values and the
predefined valueauto.
div { zi
ndex:2; }
div { zi
ndex:aut
o; }
Dimension Properties
Property Description Possible Values Examples
height Declares the height of the
element.
Lengths, percentages, and the
predefined value auto.
div { height:200p
x; }
div { height:50%;
}
maxheight
Declares the maximum height
of the element.
Lengths, percentages, and the
predefined value auto.
div { maxheigh
t:200px; }
div { maxheigh
t:50%; }
minheight
Declares the minimum height of
the element.
Lengths, percentages, and the
predefined value auto.
div { minheigh
t:200px; }
div { minheigh
t:50%; }
width Declares the width of the
element.
Lengths, percentages, and the
predefined value auto.
div { width:500p
x; }
div { width:75%;
}
maxwidth
Declares the maximum width of
the element.
Lengths, percentages, and the
predefined value auto.
div { maxwidth:
5
00px; }
div { maxwidth:
7
5%; }
minwidth
Declares the minimum width of
the element.
Lengths, percentages, and the
predefined value auto.
div { minwidth:
5
00px; }
div { minwidth:
7
5%; }
Font Properties
Property Description Possible Values Examples
fontfamily
Declares the name of the
font to be used. Previously
set in HTML via
theface attribute in a <font>
tag.
Valid font family names or generic family
names, i.e. Arial,Verdana, sansserif,
"Times
New Roman", Times, serif, etc.
Font family names can be separated by a
comma in the same declaration to allow
additional and/or generic family names to be
used if the prefereed font is unable to be
displayed.
div { fontf
amily:Arial;
}
div { fontf
amily:Arial,
Helvetica, s
ansserif;
}
fontsize
Declares the size of the
font. Previously set in
HTML via the sizeattribute
in a <font> tag.
Lengths (number and unit type—
i.e. 1em, 12pt, 10px, 80%) or one of the
following predefined values:
xxsmall
div { fonts
ize:70%; }
div { fonts
ize:0.85em;
xsmall
small
medium
large
xlarge
xxlarge
smaller
larger
}
div { fonts
ize:medium;
}
fontsizeadjust
Limited browser support:
Was part of CSS 2, but
not in CSS 2.1. This
property may return in
CSS 3.
Declares theaspect
value (font size divided by
xheight).
Numeric value div { fonts
izeadjus
t:0.54; }
div { fonts
izeadjus
t:0.46; }
fontstretch
Limited browser support:
Was part of CSS 2, but
not in CSS 2.1. This
property may return in
CSS 3.
Declares the stretch of the
font face.
normal
wider
narrower
ultracondensed
extracondensed
condensed
semicondensed
semiexpanded
expanded
extraexpanded
ultraexpanded
div { fonts
tretch:narro
wer; }
div { fonts
tretch:ultr
aexpanded;
}
fontstyle
Declares the font style. normal
italic
oblique
div { fonts
tyle:italic;
}
div { fonts
tyle:obliqu
e; }
fontvariant
Declares the font variant. normal
smallcaps
div { fontv
ariant:norma
l; }
div { fontv
ariant:smal
lcaps;
}
fontweight
Declares the font weight
(lightness or boldness)
normal
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
div { fontw
eight:bolde
r; }
div { fontw
eight:200; }
font Used as a shorthand
property to declare all of the
font properties at once
(except fontsizeadjust
and
fontstretch).
Separate values by a space in the following
order (those that are not defined will use
inherited or default initial values):
fontstyle
fontvariant
fontweight
fontsize
lineheight
fontfamily
div { font:i
talic smallcaps
bold 1e
m 1.2em Aria
l }
div { font:b
old 0.8em Ve
rdana }
Generated Content Properties
Property Description Possible Values Examples
content Generates content in the document in
conjunction with
the :before and :afterpseudoelements.
String values, URL
values, and predefined
value formats:
counter(name)
counter(name, lis
tstyletype)
counters(name, st
ring)
counters(name, st
ring, liststyletype)
attr(X)
openquote
closequote
noopenquote
noclosequote
div:before { con
tent:"some tex
t"; }
div:after { cont
ent:url(page2.ht
ml); }
counterincrement
Declares the counter increment for each
instance of a selector.
Integers and the
predefined valuenone.
More Information
counterreset
Declares the value the counter is set to
on each instance of a selector.
Integers and the
predefined valuenone.
More Information
quotes Declares the type of quotation marks to
use for quotations and embedded
quotations.
String values and the
predefined valuenone.
More Information
List Properties
Property Description Possible Values Examples
liststyletype
Declares the type of list
marker used.
disc
circle
square
decimal
decimalleadingzero
lowerroman
upperroman
loweralpha
upperalpha
lowergreek
ol { liststyl
etype:
upperro
man; }
ul { liststyl
etype:
square;
}
lowerlatin
upperlatin
hebrew
armenian
georgian
cjkideographic
hiragana
katakana
hiraganairoha
katakanairoha
liststyleposition
Declares the position of the
list marker.
inside
outside
ol { liststyl
eposition:
insi
de; }
ul { liststyl
eposition:
outs
ide; }
liststyleimage
Declares an image to be used
as the list marker.
URL values. ul { liststyl
eimage:
url(ima
ge.jpg); }
liststyle
Shorthand property to declare
three list properties at once.
Separate values by a space in the
following order (those that are not
defined will use inherited or default
initial values):
liststyletype
liststyleposition
liststyleimage
ul { liststyl
e:disc inside u
rl(image.gif);
}
ol { liststyl
e:upperroman
o
utside; }
markeroffset
Declares the marker offset for
elements with a value
ofmarker set for
thedisplay property.
Lengths and the predefined
value auto.
li:before { dis
play:marker; ma
rkeroffset:
5p
x; }
Margin Properties
Property Description Possible Values Examples
margintop
Declares
the top
margin for
the
element.
Lengths, percentages, and the predefined value auto. div { m
argint
op:5px;
}
div { m
argint
op:15%;
}
marginright
Declares
the right
margin for
the
element.
Lengths, percentages, and the predefined value auto. div { m
arginr
ight:5p
x; }
div { m
arginr
ight:1
5%; }
marginbottom
Declares
the bottom
margin for
the
element.
Lengths, percentages, and the predefined value auto. div { m
arginb
ottom:5
px; }
div { m
arginb
ottom:1
5%; }
marginleft
Declares
the left
margin for
the
element.
Lengths, percentages, and the predefined value auto. div { m
arginl
eft:5p
x; }
div { m
arginl
eft:1
5%; }
margin Shorthand
property
used to
declare all
the margin
properties
at once.
Separate values by a space in the following order (those that are not
defined will use inherited or default initial values):
margintop
marginright
marginbottom
marginleft
Undeclared values work as further shorthand notation. If only one
length value is declared, all four margins will use that length. If two
lengths are declared, the top and bottom margins will use the first
length while the right and left margins will use the second length. If
three lengths are declared, the top margin will use the first length, the
right and left margins will use the second length, and the bottom
margin will use the third length.
div { m
argin:5
px 12px
4px 7p
x; }
div { m
argin:5
px; }
div { m
argin:5
px 10p
x; }
div { m
argin:5
px 7px
4px; }
Outline Properties
Property Description Possible Values Examples
outlinecolor
Declares the outline color. Valid color names, RGB values, hexidecimal
notation.
div { outlinecolor:
green; }
div { outlinecolor:#
00FF00;
}
outlinestyle
Declares the style of the
outline.
none
dotted
dashed
solid
double
groove
ridge
div { outlinestyle:
solid; }
div { outlinestyle:
inset; }
inset
outset
outlinewidth
Declares the width of the
outline.
Lengths or the following predefined values:
thin
medium
thick
div { outlinewidth:
2px; }
div { outlinewidth:
thin; }
outline Used as a shorthand
property to set all the
background properties at
once.
Separate values by a space in the following
order (those that are not defined will use
inherited or default initial values):
outlinecolor
outlinestyle
outlinewidth
div { outlin
e:green solid
2px; }
div { outlin
e:#00FF00 doub
le thick; }
Padding Properties
Property Description Possible Values Examples
paddingtop
Declares
the top
padding for
the
element.
Lengths, percentages, and the predefined value auto. div { p
addingtop:
5p
x; }
div { p
addingtop:
1
5%; }
paddingright
Declares
the right
padding for
the
element.
Lengths, percentages, and the predefined value auto. div { p
addingright:
5
px; }
div { p
addingright:
1
5%; }
paddingbottom
Declares
the bottom
padding for
the
element.
Lengths, percentages, and the predefined value auto. div { p
addingbotto
m:5px;
}
div { p
addingbotto
m:15%;
}
paddingleft
Declares
the left
padding for
the
element.
Lengths, percentages, and the predefined value auto. div { p
addingleft:
5p
x; }
div { p
addingleft:
1
5%; }
padding Shorthand
property
used to
declare all
the margin
properties
at once.
Separate values by a space in the following order (those that are not
defined will use inherited or default initial values):
paddingtop
paddingright
paddingbottom
paddingleft
Undeclared values work as further shorthand notation. If only one
length value is declared, all four sides will use that length. If two
lengths are declared, the top and bottom sides will use the first
length while the right and left sides will use the second length. If
three lengths are declared, the top side will use the first length, the
right and left sides will use the second length, and the bottom side
will use the third length.
div { p
addin
g:5px 1
2px 4px
7px; }
div { p
addin
g:5px;
}
div { p
addin
g:5px 1
0px; }
div { p
addin
g:5px 7
px 4px;
}
Page Properties
Property Description Possible Values Examples
marks Declares the type of marks to display outside the
page box.
crop
cross
@page { ma
rks:crop;
}
orphans Declares the minimum number of lines of a
paragraph that must be left at the bottom of a
page.
Integers @page { or
phans:2; }
page Declares the type of page where an element
should be displayed.
Indentifiers More
Information
pagebreakafter
Declares a page break. auto
always
avoid
left
right
More
Information
pagebreakbefore
Declares a page break. auto
always
avoid
left
right
More
Information
pagebreakinside
Declares a page break. auto
avoid
More
Information
size Declares the size and orientation of a page box. Lengths, and the
following predefined
values:
More
Information
auto
landscape
potrait
widows Declares the minimum number of lines of a
paragraph that must be left at the top of a page.
Integers @page { wi
dows:2; }
Table Properties
Property Description Possible Values Examples
bordercollapse
Declares the way borders
are displayed.
collapse
separate
table {
borderc
ollaps
e:collap
se; }
table {
borderc
ollaps
e:separa
te; }
borderspacing
Declares the distance
separating borders
(ifbordercollapse
isseparate).
Lengths for the horizontal and vertical spacing,
separated by a space.
If one length is value is declared, that length is used
for both the horizontal and vertical spacing. If two
lengths are declared, the first one is used for
horizontal spacing and the second one is used for
vertical spacing.
table {
borders
pacing:5
px; }
table {
borders
pacing:5
px 10px;
}
captionside
Declares where the table
caption is displayed in
relation to the table.
top
bottom
left
right
caption
{ captio
nside:
t
op; }
caption
{ captio
nside:
r
ight; }
emptycells
Declares the way empty
cells are displayed
(ifbordercollapse
isseparate).
show
hide
table {
emptyce
lls:sho
w; }
table {
emptyce
lls:hid
e; }
tablelayout
Declares the type of table
layout.
auto
fixed
table {
tablela
yout:aut
o; }
table {
tablela
yout:fix
ed; }
Text Properties
Property Description Possible Values Examples
color Declares the color of the
text.
Valid color names, RGB values,
hexidecimal notation.
The predefined color names are:
aqua
black
blue
fuchsia
gray
green
lime
maroon
navy
olive
purple
red
silver
teal
white
yellow
div { color:green; }
div
{color:rgb(0,255,0);}
div { color:#00FF00;
}
direction Declares the reading
direction of the text.
ltr
rtl
ltr = lefttoright
rtl = righttoleft
div { direction:ltr;
}
div { direction:rtl;
}
lineheight
Declares the distance
between lines.
Numbers, percentages, lengths,
and the predefined value of norm
al.
div { lineheight:
nor
mal; }
div { lineheight:
2e
m; }
div { lineheight:
12
5%; }
letterspacing
Declares the amount of
space between text
characters.
A length (in addition to the default
space) or the predefined value
of normal.
div { letterspacin
g:normal; }
div { letterspacin
g:5px; }
div { letterspacin
g:1px;
}
textalign
Declares the horizontal
alignment of inline content.
left
right
center
justify
div { textalign:
cent
er; }
div { textalign:
righ
t; }
If used on a set of table cells,
this property can be given a
string value to which the text of
each row of the column will be
aligned.
td { textalign:"."
;
}
textdecoration
Declares the text
decoration.
none
underline
overline
linethrough
blink
div { textdecoratio
n:none; }
div { textdecoratio
n:underline; }
textindent
Declares the indentation of
the first line of text.
Lengths and percentages. div { textindent:
12p
x; }
div { textindent:
2%;
}
textshadow
Declares shadow effects on
the text.
A list containg a color followed by
numeric values (separated by
spaces) that specify:
1. The color for the shadow
effect
2. Horizontal distance to the
right of the text
3. Vertical distance below
the text
4. Blur radius
div { textshadow:
gre
en 2px 2px 7px; }
div { textshadow:
oli
ve 3px
4px
5px; }
texttransform
Declares the capitalization
effects on the letters in the
text.
none
capitalize
uppercase
lowercase
div { texttransfor
m:uppercase; }
div { texttransfor
m:lowercase; }
unicodebidi
Declares values relating to
bidirectional text. May be
used in conjunction with the
the directionproperty.
normal
embed
bidioverride
div { unicodebidi:
em
bed; }
div { unicodebidi:
bi
dioverride;
}
whitespace
Declares how white space
is handled in an element.
normal
pre
nowrap
div { whitespace:
pr
e; }
div { whitespace:
now
rap; }
wordspacing
Declares the space between
words in the text.
A length (in addition to the default
space) or the predefined value
of normal.
div { wordspacing:
no
rmal; }
div { wordspacin
g:1.5em; }
Other Properties
Property Description Possible Values Examples
azimuth Declares the angle that Angle values in degrees (deg), or one of div { azimut
sound travels to the
listener.
the following predefined values:
leftside
farleft
left
centerleft
center
centerright
right
farright
rightside
behind
leftwards
rightwards
h:90deg; }
div { azimut
h:behind; }
cueafter
Declares an audio cue to
play after an element.
URL values and the predefined
value none.
div { cueafte
r:url(sound.wa
v); }
div { cueafte
r:none; }
cuebefore
Declares an audio cue to
play before an element.
URL values and the predefined
value none.
div { cuebefo
re:url(sound.w
av); }
div { cuebefo
re:none; }
cue Shorthand proerty to set
both cue values at once.
URL values and the predefined
value none. Separate the values by a
space in the following order:
cuebefore
cueafter
If only one cue value is declared, it is
used for both before and after.
div { cue:ur
l(sound.wav) u
rl(sound2.wa
v); }
div { cue:ur
l(sound.wav);
}
elevation Declares the elevation of a
sound.
Angle values in degrees (deg), or one of
the following predefined values:
below
level
above
higher
lower
div { elevatio
n:30deg; }
div { elevatio
n:higher; }
pauseafter
Declares the amount of
time to pause after an
element.
Time in milliseconds (ms) or
percentages.
div { pauseaf
ter:100ms; }
div { pauseaf
ter:20%; }
pausebefore
Declares the amount of
time to pause before an
element.
Time in milliseconds (ms) or
percentages.
div { pausebe
fore:100ms; }
div { pausebe
fore:20%; }
pause Shorthand proerty to set
both pause values at once.
Separate the values by a space in the
following order:
div { pause:20
0ms 100ms; }
pausebefore
pauseafter
If only one pause value is declared, it is
used for both before and after.
div { pause:10
0ms; }
pitch Declares the average
speaking pitch of a voice.
Frequencies in hertz (Hz) or the
following predefined values:
xlow
low
medium
high
xhigh
div { pitch:12
0Hz; }
div { pitch:hi
gh; }
pitchrange
Declares a change in the
pitch range of a voice.
Number values between 0 and 100
(lower values indicate a flat voice while
higher values indicate an animated
voice).
div { pitchra
nge:50; }
div { pitchra
nge:99; }
playduring
Declares a background
sound to be played while
the current element is
spoken.
URL value, followed by one or more of
the following keywords, separated by
spaces:
mix
repeat
Alternatley, one of the following
keywords:
auto
none
div { playdur
ing:url(musi
c.wav); }
div { playdur
ing:url(musi
c.wav) repeat;
}
div { playdur
ing:none; }
richness Declares the richness of
the voice in spoken text.
Numeric values between 0 and 100
(lower values have less richness and
higher values have more richness).
div { richnes
s:50; }
div { richnes
s:0; }
speak Declares if/how text is
spoken.
normal
none
spellout
div { speak:no
ne; }
div { speak:sp
ellout;
}
speakheader
Declares how often table
header cells are spoken.
once
always
th { speakhea
der:once; }
th { speakhea
der:always; }
speaknumeral
Declares how numerals
are spoken.
digits
continuous
div { speaknu
meral:digits;
}
div { speaknu
meral:continuo
us; }
speakpunctuation
Declares how punctuation
is spoken.
code
none
div { speakpu
nctuation:cod
e; }
div { speakpu
nctuation:non
e; }
speechrate
Declares the speech rate
of spoken text.
A number indicating the number of
words per minute, or one of the following
predefined values:
xslow
slow
medium
fast
xfast
faster
slower
div { speechr
ate:50; }
div { speechr
ate:medium; }
stress Declares the stress of the
voice on spoken text.
Numeric values between 0 and 100
(lower values have less stress and
higher values have more stress).
div { stress:5
0; }
div { stres
s:0; }
voicefamily
Declares the voice family
of spoken text.
Generic or specific voice family names. More Information
volume Declares the median
volume.
Numbers between 0 and 100,
percentages, or one of the following
predefined values:
silent
xsoft
soft
medium
loud
xloud
div { volume:5
0; }
div { volume:s
ilent; }