0% found this document useful (0 votes)
83 views

Background Properties: Property Description Possible Values Examples

The CSS background and border properties allow styling of elements on web pages. Some key properties include: - background-color to set the background color - background-image to add a background image - border properties like border-color, border-style, and border-width to style element borders - Shorthand properties combine settings for related properties into a single declaration.

Uploaded by

Rekha Bhardwaj
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
83 views

Background Properties: Property Description Possible Values Examples

The CSS background and border properties allow styling of elements on web pages. Some key properties include: - background-color to set the background color - background-image to add a background image - border properties like border-color, border-style, and border-width to style element borders - Shorthand properties combine settings for related properties into a single declaration.

Uploaded by

Rekha Bhardwaj
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 21

Background Properties

CSS Background Properties


Property Description Possible Values Examples
Declares the
attachment of a div { background-
background background image (to fixed attachment:fixed; }
-attachment scroll with the page scroll div { background-attachment:scroll;
content or be in a }
fixed position).
background Declares the Valid color names, RGB values, div { background-color:green; }
-color background color. hexidecimal notation. div { color:#00FF00; }
div { background-
Declares the
background image:url(images/img.jpg); }
background image of URL values.
-image body { background-
an element.
image:url(img.jpg); }
Lengths or percentages for the x
and y positions, or one of the
predefined values:
top left
top center div { background-position:10px
Declares the position
background top right 50px; }
of a background
-position center left div { background-position:bottom
image.
center center right; }
center right
bottom left
bottom center
bottom right
repeat
Declares how and/or div { background-repeat:repeat-x; }
background repeat-x
if a background image div { background-repeat:no-
-repeat repeat-y
repeats. repeat; }
no-repeat
Separate values by a space in the
following order (those that are not
defined will use inherited or default
Used as a shorthand
initial values):
property to set all the
background background-color
background properties
background-image
at once.
background-repeat
background-attachment
background-position

1
Border Properties
CSS Border Properties

Property Description Possible Values Examples

Declares the Valid color names, RGB values,


border-top- div { border-top-color:green; }
color of the hexidecimal notation, or the predefined
color div { border-top-color:#00FF00; }
top border. value transparent.
none
hidden
dotted
dashed
Declares the
border-top- solid div { border-top-style:solid; }
style of the
style double div { border-top-style:inset; }
top border.
groove
ridge
inset
outset
Lengths or the following predefined
Declares the values:
border-top- div { border-top-width:2px; }
width of the thin
width div { border-top-width:thin; }
top border. medium
thick
Used as a Separate values by a space in the
shorthand following order (those that are not defined
property to will use inherited or default initial div { border-top:2px solid green; }
border-top set all the values): div { border-top:thick double
border-top border-top-width #00FF00; }
properties at border-top-style
once. border-top-color
Declares the Valid color names, RGB values, div { border-right-color:green; }
border-right-
color of the hexidecimal notation, or the predefined div { border-right-
color
right border. value transparent. color:#00FF00; }
none
hidden
dotted
dashed
Declares the
border-right- solid div { border-right-style:solid; }
style of the
style double div { border-right-style:inset; }
right border.
groove
ridge
inset
outset
border-right- Declares the Lengths or the following predefined div { border-right-width:2px; }
2
values:
width of the thin
width div { border-right-width:thin; }
right border. medium
thick
Used as a Separate values by a space in the
shorthand following order (those that are not defined
div { border-right:2px solid
property to will use inherited or default initial
green; }
border-right set all the values):
div { border-right:thick double
border-right border-right-width
#00FF00; }
properties at border-right-style
once. border-right-color
Declares the
Valid color names, RGB values, div { border-bottom-color:green; }
border- color of the
hexidecimal notation, or the predefined div { border-bottom-
bottom-color bottom
value transparent. color:#00FF00; }
border.
none
hidden
dotted
Declares the dashed
border- style of the solid div { border-bottom-style:solid; }
bottom-style bottom double div { border-bottom-style:inset; }
border. groove
ridge
inset
outset
Lengths or the following predefined
Declares the
values:
border- width of the div { border-bottom-width:2px; }
thin
bottom-width bottom div { border-bottom-width:thin; }
medium
border.
thick
Used as a Separate values by a space in the
shorthand following order (those that are not defined
div { border-bottom:2px solid
property to will use inherited or default initial
green; }
border-bottom set all the values):
div { border-bottom:thick double
border-bottom border-bottom-width
#00FF00; }
properties at border-bottom-style
once. border-bottom-color
Declares the Valid color names, RGB values,
border-left- div { border-left-color:green; }
color of the hexidecimal notation, or the predefined
color div { border-left-color:#00FF00; }
left border. value transparent.
none
hidden
Declares the dotted
border-left- div { border-left-style:solid; }
style of the dashed
style div { border-left-style:inset; }
left border. solid
double
groove
3
ridge
inset
outset
Lengths or the following predefined
Declares the values:
border-left- div { border-left-width:2px; }
width of the thin
width div { border-left-width:thin; }
left border. medium
thick
Used as a Separate values by a space in the
shorthand following order (those that are not defined
property to will use inherited or default initial div { border-left:2px solid green; }
border-left set all the values): div { border-left:thick double
border-left border-left-width #00FF00; }
properties at border-left-style
once. border-left-color
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:
border-top-color
border-right-color
Declares the border-bottom-color div { border-color:green red blue
border color border-left-color olive; }
border-color of all four Undeclared values work as further div { border-color:green; }
borders at shorthand notation. If only one color div { border-color:green red; }
once. value is declared, all four borders will use div { border-color:green red blue; }
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.

none
hidden
dotted
div { border-style:solid dotted
Declares the dashed
dashed double; }
border style solid
div { border-style:solid; }
border-style of all four double
div { border-style:solid dotted; }
borders at groove
div { border-style:solid dotted
once. ridge
dashed; }
inset
outset
Undeclared values work as further
4
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.
Lengths or the following predefined
values:
thin
medium
thick
Undeclared values work as further
div { border-width:1px 3px 5px
Declares the shorthand notation. If only one width
2px; }
width of all value is declared, all four borders will use
border-width div { border-width:thin; }
four borders that width. If two widths are declared, the
div { border-width:2px 4px; }
at once. top and bottom borders will use the first
div { border-width:2px 4px 5px; }
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.
Used as a
shorthand to Separate values by a space in the
declare the following order (those that are not defined
border will use inherited or default initial
div { border:1px double green; }
border properties values):
div { border:thin solid #00FF00; }
when all four border-width
borders will border-style
have the same border-color
appearance.

Classification and Positioning Properties


CSS Classification/Positioning Properties

Property Description Possible Values Examples

5
Declares the side(s) of an left
element where no previous right div { clear:right; }
clear
floating elements are both div { clear:both; }
allowed to be adjacent. none
URL values, and the following
prefefined values:
auto
crosshair
default
pointer
move
e-resize div { cursor:crosshair; }
Declares the type of cursor ne-resize div { cusrsor:url(image.csr); }
cursor
to be displayed. nw-resize div { cusrsor:url(image.csr),
n-resize pointer; }
se-resize
sw-resize
s-resize
w-resize
text
wait
help

none
inline
block
list-item
run-in
compact
marker
table div { display:none; }
Declares if/how the element
display inline-table div { display:inline; }
displays.
table-row-group div { display:marker; }
table-header-group
table-footer-group
table-row
table-column-group
table-column
table-cell
table-caption
Declares whether a box
should float to the left or left
div { float:left; }
float right of other content, or right
div { float:right; }
whether it should not be none
floated at all.
Declares the visibility of visible
div { visibility:visible; }
visibility boxes generated by an hidden
div { visibility:hidden; }
element. collapse
6
Declares the distance that
the top content edge of the
element is offset below the
top edge of its containing Lengths, percentages, and the div { top:15px; }
top
block. The position predefined value auto. div { top:2%; }
property of the element
must also be set to a value
other than static.
Declares the distance that
the right content edge of the
element is offset to the left
of the right edge of its Lengths, percentages, and the div { right:15px; }
right
containing block. The predefined value auto. div { right:2%; }
position property of the
element must also be set to
a value other than static.
Declares the distance that
the bottom content edge of
the element is offset above
the bottom edge of its Lengths, percentages, and the div { bottom:15px; }
bottom
containing block. The predefined value auto. div { bottom:2%; }
position property of the
element must also be set to
a value other than static.
Declares the distance that
the left content edge of the
element is offset to the right
of the left edge of its Lengths, percentages, and the div { left:15px; }
left
containing block. The predefined value auto. div { left:2%; }
position property of the
element must also be set to
a value other than static.
static
Declares the type of relative div { position:absolute; }
position
positioning of an element. absolute div { position:relative; }
fixed
Shapes, or the predefined value
auto.
Declares the shape of a
In CSS 2, the only valid shape
clipped region when the div { clip:auto; }
is a rectangle, using the
clip value of the overflow div { clip:rect(2px, 4px, 7px,
following format to specify the
property is set to a value 5px); }
offset lengths from each side of
other than visible.
the box:
rect(top, right, bottom, left)
Declares how content that visible
div { overflow:hidden; }
overflow overflows the element's box hidden
div { overflow:scroll; }
is handled. scroll
7
auto
Lengths, percentages, and the
following predefined values:
baseline
sub
Declares the vertical
super span { vertical-align:middle; }
vertical-align alignment of an inline-level
top td { vertical-align:top; }
element or a table cell.
text-top
middle
bottom
text-bottom
Declares the stack order of Integer values and the div { z-index:2; }
z-index
the element. predefined value auto. div { z-index:auto; }

Dimension Properties
CSS Dimension Properties

Property Description Possible Values Examples

Declares the height Lengths, percentages, and the div { height:200px; }


height
of the element. predefined value auto. div { height:50%; }
Declares the
Lengths, percentages, and the div { max-height:200px; }
max-height maximum height of
predefined value auto. div { max-height:50%; }
the element.
Declares the
Lengths, percentages, and the div { min-height:200px; }
min-height minimum height of
predefined value auto. div { min-height:50%; }
the element.
Declares the width Lengths, percentages, and the div { width:500px; }
width
of the element. predefined value auto. div { width:75%; }
Declares the
Lengths, percentages, and the div { max-width:500px; }
max-width maximum width of
predefined value auto. div { max-width:75%; }
the element.
Declares the
Lengths, percentages, and the div { min-width:500px; }
min-width minimum width of
predefined value auto. div { min-width:75%; }
the element.

Font Properties
CSS Font Properties
Property Description Possible Values Examples
Declares the name Valid font family names or generic div { font-family:Arial; }
font-
of the font to be family names, i.e. Arial, Verdana, sans- div { font-family:Arial, Helvetica,
family
used. Previously set serif, "Times New Roman", Times, serif, sans-serif; }
8
etc.
Font family names can be separated by a
in HTML via the
comma in the same declaration to allow
face attribute in a
additional and/or generic family names
<font> tag.
to be used if the prefereed font is unable
to be displayed.
Lengths (number and unit type— i.e.
1em, 12pt, 10px, 80%) or one of the
following predefined values:
xx-small
Declares the size of
x-small
the font. Previously div { font-size:70%; }
small
font-size set in HTML via div { font-size:0.85em; }
medium
the size attribute in div { font-size:medium; }
large
a <font> tag.
x-large
xx-large
smaller
larger
Limited browser
support: Was part
of CSS 2, but not
in CSS 2.1. This
font-size- property may div { font-size-adjust:0.54; }
Numeric value
adjust return in CSS 3. div { font-size-adjust:0.46; }
Declares the aspect
value (font size
divided by x-
height).
normal
wider
Limited browser
narrower
support: Was part
ultra-condensed
of CSS 2, but not
extra-condensed
font- in CSS 2.1. This div { font-stretch:narrower; }
condensed
stretch property may div { font-stretch:ultra-expanded; }
semi-condensed
return in CSS 3.
semi-expanded
Declares the stretch
expanded
of the font face.
extra-expanded
ultra-expanded
normal
Declares the font div { font-style:italic; }
font-style italic
style. div { font-style:oblique; }
oblique
font- Declares the font normal div { font-variant:normal; }
variant variant. small-caps div { font-variant:small-caps; }
Declares the font normal
font- div { font-weight:bolder; }
weight (lightness or bold
weight div { font-weight:200; }
boldness) bolder
9
lighter
100
200
300
400
500
600
700
800
900
Separate values by a space in the
following order (those that are not
Used as a
defined will use inherited or default
shorthand property
initial values):
to declare all of the div { font:italic small-caps bold
font-style
font font properties at 1em 1.2em Arial }
font-variant
once (except font- div { font:bold 0.8em Verdana }
font-weight
size-adjust and
font-size
font-stretch).
line-height
font-family

Generated Content Properties


CSS Generated Content Properties
Property Description Possible Values Examples
String values, URL
values, and predefined
Generates content in the value formats:
div:before { content:"some text"; }
document in conjunction with counter(name)
content div:after { content:url(page2.html);
the :before and :after pseudo- counter(name, list-
}
elements. style-type)
counters(name, string)
counters(name, string,
10
list-style-type)
attr(X)
open-quote
close-quote
no-open-quote
no-close-quote
counter- Declares the counter increment Integers and the
More Information
increment for each instance of a selector. predefined value none.
Declares the value the counter
counter- Integers and the
is set to on each instance of a More Information
reset predefined value none.
selector.
Declares the type of quotation
String values and the
quotes marks to use for quotations and More Information
predefined value none.
embedded quotations.

List Properties
CSS List Properties
Property Description Possible Values Examples
disc
circle
square
decimal
decimal-leading-zero
Declares the
lower-roman ol { list-style-type:upper-roman; }
list-style-type type of list
upper-roman ul { list-style-type:square; }
marker used.
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
11
hebrew
armenian
georgian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
Declares the
list-style- inside ol { list-style-position:inside; }
position of the
position outside ul { list-style-position:outside; }
list marker.
Declares an
list-style- image to be
URL values. ul { list-style-image:url(image.jpg); }
image used as the list
marker.
Separate values by a space in the
Shorthand following order (those that are not
property to defined will use inherited or default ul { list-style:disc inside
list-style declare three list initial values): url(image.gif); }
properties at list-style-type ol { list-style:upper-roman outside; }
once. list-style-position
list-style-image
Declares the
marker offset
for elements
Lengths and the predefined value li:before { display:marker; marker-
marker-offset with a value of
auto. offset:5px; }
marker set for
the display
property.

Margin Properties
CSS Margin Properties
Property Description Possible Values Examples
Declares the top
Lengths, percentages, and the div { margin-top:5px; }
margin-top margin for the
predefined value auto. div { margin-top:15%; }
element.
Declares the right
Lengths, percentages, and the div { margin-right:5px; }
margin-right margin for the
predefined value auto. div { margin-right:15%; }
element.
Declares the bottom
Lengths, percentages, and the div { margin-bottom:5px; }
margin-bottom margin for the
predefined value auto. div { margin-bottom:15%; }
element.

12
Declares the left
Lengths, percentages, and the div { margin-left:5px; }
margin-left margin for the
predefined value auto. div { margin-left:15%; }
element.
Separate values by a space in the
following order (those that are
not defined will use inherited or
default initial values):
margin-top
margin-right
margin-bottom
margin-left
Undeclared values work as
div { margin:5px 12px 4px
Shorthand property further shorthand notation. If only
7px; }
used to declare all the one length value is declared, all
margin div { margin:5px; }
margin properties at four margins will use that length.
div { margin:5px 10px; }
once. If two lengths are declared, the
div { margin:5px 7px 4px; }
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.

Outline Properties
CSS Outline Properties
Property Description Possible Values Examples
Declares the Valid color names, RGB values, div { outline-color:green; }
outline-color
outline color. hexidecimal notation. div { outline-color:#00FF00; }
none
dotted
dashed
Declares the solid
div { outline-style:solid; }
outline-style style of the double
div { outline-style:inset; }
outline. groove
ridge
inset
outset
Lengths or the following predefined
Declares the values:
div { outline-width:2px; }
outline-width width of the thin
div { outline-width:thin; }
outline. medium
thick

13
Used as a Separate values by a space in the
shorthand following order (those that are not
property to set defined will use inherited or default div { outline:green solid 2px; }
outline all the initial values): div { outline:#00FF00 double thick;
background outline-color }
properties at outline-style
once. outline-width

Padding Properties
CSS Padding Properties
Property Description Possible Values Examples
Declares the top
Lengths, percentages, and the div { padding-top:5px; }
padding-top padding for the
predefined value auto. div { padding-top:15%; }
element.
Declares the right
Lengths, percentages, and the div { padding-right:5px; }
padding-right padding for the
predefined value auto. div { padding-right:15%; }
element.
Declares the bottom
Lengths, percentages, and the div { padding-bottom:5px; }
padding-bottom padding for the
predefined value auto. div { padding-bottom:15%; }
element.
Declares the left
Lengths, percentages, and the div { padding-left:5px; }
padding-left padding for the
predefined value auto. div { padding-left:15%; }
element.
Separate values by a space in the
following order (those that are not
defined will use inherited or
default initial values):
padding-top
padding-right
padding-bottom
padding-left
Undeclared values work as further div { padding:5px 12px 4px 7px;
Shorthand property
shorthand notation. If only one }
used to declare all
padding length value is declared, all four div { padding:5px; }
the margin
sides will use that length. If two div { padding:5px 10px; }
properties at once.
lengths are declared, the top and div { padding:5px 7px 4px; }
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.

14
Page Properties
CSS Page Properties

Property Description Possible Values Examples

Declares the type of marks to display crop


marks @page { marks:crop; }
outside the page box. cross
Declares the minimum number of
orphans lines of a paragraph that must be left Integers @page { orphans:2; }
at the bottom of a page.
Declares the type of page where an
page Indentifiers More Information
element should be displayed.
auto
always
page-break-
Declares a page break. avoid More Information
after
left
right
auto
always
page-break-
Declares a page break. avoid More Information
before
left
right
auto
page-break-
Declares a page break. avoid More Information
inside

Lengths, and the


following predefined
Declares the size and orientation of a values:
size More Information
page box. auto
landscape
potrait
Declares the minimum number of
widows lines of a paragraph that must be left Integers @page { widows:2; }
at the top of a page.

Table Properties
CSS Table Properties
Property Description Possible Values Examples
table { border-
Declares the way
collapse collapse:collapse; }
border-collapse borders are
separate table { border-
displayed.
collapse:separate; }
border-spacing Declares the Lengths for the horizontal and vertical table { border-spacing:5px; }
15
spacing, separated by a space.
distance If one length is value is declared, that
separating length is used for both the horizontal
table { border-spacing:5px 10px;
borders (if and vertical spacing. If two lengths are
}
border-collapse declared, the first one is used for
is separate). horizontal spacing and the second one
is used for vertical spacing.
Declares where
top
the table caption
bottom caption { caption-side:top; }
caption-side is displayed in
left caption { caption-side:right; }
relation to the
right
table.
Declares the way
empty cells are
show table { empty-cells:show; }
empty-cells displayed (if
hide table { empty-cells:hide; }
border-collapse
is separate).
Declares the type auto table { table-layout:auto; }
table-layout
of table layout. fixed table { table-layout:fixed; }

Text Properties
CSS Text Properties
Property Description Possible Values Examples
Valid color names, RGB values,
hexidecimal notation.
The predefined color names are:
aqua
black
blue
fuchsia
gray
Declares the green div { color:green; }
color color of the lime div { color:rgb(0,255,0); }
text. maroon div { color:#00FF00; }
navy
olive
purple
red
silver
teal
white
yellow

16
Declares the ltr
reading rtl div { direction:ltr; }
direction
direction of ltr = left-to-right div { direction:rtl; }
the text. rtl = right-to-left
Declares the div { line-height:normal; }
Numbers, percentages, lengths, and the
line-height distance div { line-height:2em; }
predefined value of normal.
between lines. div { line-height:125%; }
Declares the
A length (in addition to the default div { letter-spacing:normal; }
amount of
letter-spacing space) or the predefined value of div { letter-spacing:5px; }
space between
normal. div { letter-spacing:-1px; }
text characters.
left
right
Declares the center
div { text-align:center; }
horizontal justify
text-align div { text-align:right; }
alignment of If used on a set of table cells, this
td { text-align:"."; }
inline content. property can be given a string value to
which the text of each row of the
column will be aligned.
none
Declares the underline
div { text-decoration:none; }
text-decoration text overline
div { text-decoration:underline; }
decoration. line-through
blink
Declares the
indentation of div { text-indent:12px; }
text-indent Lengths and percentages.
the first line of div { text-indent:2%; }
text.
A list containg a color followed by
numeric values (separated by spaces)
that specify: div { text-shadow:green 2px 2px
Declares
The color for the shadow effect 7px; }
text-shadow shadow effects
Horizontal distance to the right of div { text-shadow:olive -3px -4px
on the text.
the text 5px; }
Vertical distance below the text
Blur radius
Declares the
none
capitalization
capitalize div { text-transform:uppercase; }
text-transform effects on the
uppercase div { text-transform:lowercase; }
letters in the
lowercase
text.
Declares
values relating normal
div { unicode-bidi:embed; }
unicode-bidi to bidirectional embed
div { unicode-bidi:bidi-override; }
text. May be bidi-override
used in
17
conjunction
with the the
direction
property.
Declares how
normal
white space is div { white-space:pre; }
white-space pre
handled in an div { white-space:nowrap; }
nowrap
element.
Declares the
A length (in addition to the default
space between div { word-spacing:normal; }
word-spacing space) or the predefined value of
words in the div { word-spacing:1.5em; }
normal.
text.

Other Properties
Other CSS Properties
Property Description Possible Values Examples
Angle values in degrees (deg), or
one of the following predefined
values:
left-side
far-left
left
Declares the
center-left
angle that sound div { azimuth:90deg; }
azimuth center
travels to the div { azimuth:behind; }
center-right
listener.
right
far-right
right-side
behind
leftwards
rightwards
Declares an
URL values and the predefined div { cue-after:url(sound.wav); }
cue-after audio cue to play
value none. div { cue-after:none; }
after an element.
Declares an
audio cue to play URL values and the predefined div { cue-before:url(sound.wav); }
cue-before
before an value none. div { cue-before:none; }
element.

18
URL values and the predefined
value none. Separate the values
Shorthand by a space in the following order:
div { cue:url(sound.wav)
proerty to set cue-before
cue url(sound2.wav); }
both cue values cue-after
div { cue:url(sound.wav); }
at once. If only one cue value is declared,
it is used for both before and
after.
Angle values in degrees (deg), or
one of the following predefined
values:
Declares the
below div { elevation:30deg; }
elevation elevation of a
level div { elevation:higher; }
sound.
above
higher
lower
Declares the
amount of time Time in milliseconds (ms) or div { pause-after:100ms; }
pause-after
to pause after an percentages. div { pause-after:20%; }
element.
Declares the
amount of time Time in milliseconds (ms) or div { pause-before:100ms; }
pause-before
to pause before percentages. div { pause-before:20%; }
an element.
Separate the values by a space in
the following order:
Shorthand
pause-before
proerty to set div { pause:200ms 100ms; }
pause pause-after
both pause div { pause:100ms; }
If only one pause value is
values at once.
declared, it is used for both
before and after.
Frequencies in hertz (Hz) or the
following predefined values:
Declares the x-low
div { pitch:120Hz; }
pitch average speaking low
div { pitch:high; }
pitch of a voice. medium
high
x-high
Declares a Number values between 0 and
change in the 100 (lower values indicate a flat div { pitch-range:50; }
pitch-range
pitch range of a voice while higher values div { pitch-range:99; }
voice. indicate an animated voice).
Declares a URL value, followed by one or div { play-during:url(music.wav); }
background more of the following keywords, div { play-during:url(music.wav)
play-during
sound to be separated by spaces: repeat; }
played while the mix div { play-during:none; }
19
repeat
Alternatley, one of the following
current element
keywords:
is spoken.
auto
none
Declares the Numeric values between 0 and
richness of the 100 (lower values have less div { richness:50; }
richness
voice in spoken richness and higher values have div { richness:0; }
text. more richness).
normal
Declares if/how div { speak:none; }
speak none
text is spoken. div { speak:spell-out; }
spell-out
Declares how
often table once th { speak-header:once; }
speak-header
header cells are always th { speak-header:always; }
spoken.
Declares how
digits div { speak-numeral:digits; }
speak-numeral numerals are
continuous div { speak-numeral:continuous; }
spoken.
Declares how
speak- code div { speak-punctuation:code; }
punctuation is
punctuation none div { speak-punctuation:none; }
spoken.
A number indicating the number
of words per minute, or one of
the following predefined values:
x-slow
Declares the
slow div { speech-rate:50; }
speech-rate speech rate of
medium div { speech-rate:medium; }
spoken text.
fast
x-fast
faster
slower
Declares the Numeric values between 0 and
stress of the 100 (lower values have less stress div { stress:50; }
stress
voice on spoken and higher values have more div { stress:0; }
text. stress).
Declares the
Generic or specific voice family
voice-family voice family of More Information
names.
spoken text.
Numbers between 0 and 100,
percentages, or one of the
following predefined values:
Declares the div { volume:50; }
volume silent
median volume. div { volume:silent; }
x-soft
soft
medium
20
loud
x-loud

21

You might also like