Style object
The Style object represents an individual style statement. The Style object
can be accessed from the document or from the elements to which that style is
applied.
The Style object's properties are described below:
N: Netscape (including Mozilla when N6 or higher), IE: Internet Explorer, M: Mac IE only,
W: Windows IE only
Property |
Description |
Values |
N |
IE |
background |
Sets or returns all background properties in one |
backgroundColor
backgroundImage
backgroundRepeat
backgroundAttachment
backgroundPosition
|
6 |
4 |
backgroundAttachment |
Sets or returns whether a background image is fixed or scrolls with
the rest of the page |
scroll
fixed |
6 |
4 |
backgroundColor |
Sets or returns the background color of the element |
color-rgb
color-hex
color-name
transparent |
6 |
4 |
backgroundImage |
Sets or returns the background image of the element |
url("URL")
none |
6 |
4 |
backgroundPosition |
Sets or returns the starting position of the background
image |
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
x-% y-%
x-pos y-pos |
6 |
4 |
backgroundPositionX |
Sets or returns the x-coordinates of the backgroundPosition
property |
left
center
right
x-%
x-pos |
|
4 |
backgroundPositionY |
Sets or returns the y-coordinates of the backgroundPosition
property |
top
center
bottom
y-%
y-pos |
|
4 |
backgroundRepeat |
Sets or returns if/how a background image will be repeated |
repeat
repeat-x
repeat-y
no-repeat |
6 |
4 |
Property |
Description |
Values |
N |
IE |
border |
Sets or returns all properties for the four borders in one |
borderWidth
borderStyle
borderColor |
6 |
4 |
borderBottom |
Sets or returns all properties for the bottom border in one |
borderWidth
borderStyle
borderColor |
6 |
4 |
borderLeft |
Sets or returns all property for the left border in one |
borderWidth
borderStyle
borderColor |
6 |
4 |
borderRight |
Sets or returns all property for the right border in one |
borderWidth
borderStyle
borderColor |
6 |
4 |
borderTop |
Sets or returns all property for the top border in one |
borderWidth
borderStyle
borderColor |
6 |
4 |
borderBottomColor |
Sets or returns the color of the bottom border |
borderColor |
6 |
4 |
borderLeftColor |
Sets or returns the color of the left border |
borderColor |
6 |
4 |
borderRightColor |
Sets or returns the color of the right border |
borderColor |
6 |
4 |
borderTopColor |
Sets or returns the color of the top border |
borderColor |
6 |
4 |
borderBottomStyle |
Sets or returns the style of the bottom border |
borderStyle |
6 |
4 |
borderLeftStyle |
Sets or returns the style of the left border |
borderStyle |
6 |
4 |
borderRightStyle |
Sets or returns the style of the right border |
borderStyle |
6 |
4 |
borderTopStyle |
Sets or returns the style of the top border |
borderStyle |
6 |
4 |
borderBottomWidth |
Sets or returns the width of the bottom border |
borderWidth |
6 |
4 |
borderLeftWidth |
Sets or returns the width of the left border |
borderWidth |
6 |
4 |
borderRightWidth |
Sets or returns the width of the right border |
borderWidth |
6 |
4 |
borderTopWidth |
Sets or returns the width of the top border |
borderWidth |
6 |
4 |
borderColor |
Sets or returns the color of all four borders (can have up
to four colors) |
color-rgb
color-hex
color-name |
6 |
4 |
borderStyle |
Sets or returns the style of all four borders |
none
dotted
dashed
solid
double
groove
ridge
inset
outset |
6 |
4 |
borderWidth |
Sets or returns the width of all four borders |
thin
medium
thick
length |
6 |
4 |
margin |
Sets or returns the top, right, bottom, and left margins of
the element |
marginTop
marginRight
marginBottom
marginLeft |
6 |
4 |
marginBottom |
Sets or returns the bottom margin of the element |
auto
length
% |
6 |
4 |
marginLeft |
Sets or returns the left margin of the element |
auto
length
% |
6 |
4 |
marginRight |
Sets or returns the right margin of the element |
auto
length
% |
6 |
4 |
marginTop |
Sets or returns the top margin of the element |
auto
length
% |
6 |
4 |
outline |
Sets or returns the color, style, and width of the outline around the element |
outlineColor
outlineStyle
outlineWidth |
6 |
5 (M) |
outlineColor |
Sets or returns the color of the outline around the element |
color-rgb
color-hex
color-name
invert |
6 |
5 (M) |
outlineStyle |
Sets or returns the style of the outline around the element |
none
dotted
dashed
solid
double
groove
ridge
inset
outset |
6 |
5 (M) |
outlineWidth |
Sets or returns the width of the outline around the element |
thin
medium
thick
length |
6 |
5 (M) |
padding |
Sets or returns the top, right, bottom, and left padding of
the element |
paddingTop
paddingRight
paddingBottom
paddingLeft |
6 |
4 |
paddingBottom |
Sets or returns the bottom padding of the element |
length
% |
6 |
4 |
paddingLeft |
Sets or returns the left padding of the element |
length
% |
6 |
4 |
paddingRight |
Sets or returns the right padding of the element |
length
% |
6 |
4 |
paddingTop |
Sets or returns the top padding of the element |
length
% |
6 |
4 |
Property |
Description |
Values |
N |
IE |
clear |
Sets or returns which sides of an element other floating
elements are not allowed |
left
right
both
none |
6 |
4 |
clip |
Sets or returns the shape of an element. What if an image
is larger than the element it goes inside? - This property lets you specify
the dimensions of an element that should be visible, and the element is
clipped into this shape, and displayed |
auto
rect(top right bottom left) |
6 |
4 |
clipBottom |
Returns the bottom coordinate of the clipping region |
auto
length |
6 |
5 (W) |
clipLeft |
Returns the left coordinate of the clipping region |
auto
length |
6 |
5 (W) |
clipRight |
Returns the right coordinate of the clipping region |
auto
length |
6 |
5 (W) |
clipTop |
Returns the top coordinate of the clipping region |
auto
length |
6 |
5 (W) |
content |
Sets or returns meta-information |
|
6 |
5 (M) |
counterIncrement |
|
|
6 |
5 (M) |
counterReset |
|
|
6 |
5 (M) |
cssFloat |
|
|
6 |
5 (M) |
cursor |
Sets or returns the type of cursor to be displayed when the
mouse pointer moves over the element |
auto
crosshair
default
hand
pointer
move
e-resize
ne-resize
nw-resize
n-resize
se-resize
sw-resize
s-resize
w-resize
text
wait
help
all-scroll (IE6+)
col-resize (IE6+)
no-drop (IE6+)
not-allowed (IE6+)
pointer (IE6+)
progress (IE6+)
row-resize (IE6+)
url(uri) (IE6+)
vertical-text (IE6+) |
6 |
4 |
direction |
Sets or returns the reading order |
ltr
rtl |
6 |
5 |
display |
Sets or returns how/if an element is displayed |
block
none
inline
inline-block
list-item (IE6+)
table-header-group
table-footer-group |
6 |
4 |
filter |
Sets or returns the filter/filters applied to the element |
|
|
4 (W) |
layoutGrid |
|
|
|
5 (W) |
layoutGridChar |
|
|
|
5 (W) |
layoutGridLine |
|
|
|
5 (W) |
layoutGridMode |
|
|
|
5 (W) |
layoutGridType |
|
|
|
5 (W) |
markerOffset |
|
|
6 |
5 (M) |
marks |
|
|
6 |
5 (M) |
maxHeight |
|
|
6 |
5 (M) |
maxWidth |
|
|
6 |
5 (M) |
minHeight |
|
|
6 |
6 |
minWidth |
|
|
6 |
5 (M) |
MozOpacity |
|
|
6 |
|
overflow |
Sets what happens if the content of an element overflow its area |
visible, hidden, scroll, auto |
6 |
4 |
overflowX |
|
|
6 |
5 (W) |
overflowY |
|
|
6 |
5 (W) |
styleFloat |
|
|
|
4 |
verticalAlign |
|
baseline, sub. super, top, middle, bottom, text-top, text-bottom, or percent value |
6 |
4 |
visibility |
|
|
6 |
4 |
width |
|
|
6 |
4 |
zoom |
|
|
|
5.5 (W) |
Property |
Description |
Values |
N |
IE |
listStyle |
Sets or returns all the properties for a list in one |
listStyleType
listStylePosition
listStyleImage |
6 |
4 |
listStyleImage |
Sets or returns the value of the image that is the
list-item marker |
none
url(url) |
6 |
4 |
listStylePosition |
Sets or returns where the list-item marker is placed in the
list |
outside
inside |
6 |
4 |
listStyleType |
Sets or returns the type of the list-item marker |
disc
circle
square
decimal
lower-roman
upper-roman
lower-alpha
upper-alpha
none |
6 |
4 |
Property |
Description |
Values |
N |
IE |
accelerator |
Sets or returns a Boolean value indicating whether the
element contains an accelerator key |
false
true |
|
5 (W) |
behavior |
|
|
|
5 (W) |
cssText |
|
|
6 |
4 |
imeMode |
|
|
|
5 (W) |
Property |
Description |
Values |
N |
IE |
bottom |
|
auto, % length |
6 |
5 |
height |
|
|
6 |
4 |
left |
|
|
6 |
4 |
pixelBottom |
|
|
|
4 |
pixelHeight |
|
|
|
4 |
pixelLeft |
|
|
|
4 |
pixelRight |
|
|
|
4 |
pixelTop |
|
|
|
4 |
pixelWidth |
|
|
|
4 |
posBottom |
|
|
|
4 |
posHeight |
|
|
|
4 |
posLeft |
|
|
|
4 |
posRight |
|
|
|
4 |
posTop |
|
|
|
4 |
posWidth |
|
|
|
4 |
position |
|
static, relative, absolute, fixed |
6 |
4 |
right |
|
|
6 |
5 |
top |
|
|
6 |
4 |
width |
|
|
6 |
4 |
zIndex |
Sets the stack order of an element |
auto, number |
6 |
4 |
Property |
Description |
Values |
N |
IE |
orphans |
|
|
6 |
5 (M) |
widows |
|
|
6 |
5 (M) |
page |
|
|
6 |
5 (M) |
pageBreakAfter |
|
|
6 |
4 |
pageBreakBefore |
|
|
6 |
4 |
pageBreakInside |
|
|
6 |
5 (M) |
size |
|
|
6 |
|
Property |
Description |
Values |
N |
IE |
scrollbar3dLightColor |
|
|
|
5.5 (W) |
scrollbarArrowColor |
|
|
|
5.5 (W) |
scrollbarBaseColor |
|
|
|
5.5 (W) |
scrollbarDarkShadowColor |
|
|
|
5.5 (W) |
scrollbarFaceColor |
|
|
|
5.5 (W) |
scrollbarHighlightColor |
|
|
|
5.5 (W) |
scrollbarShadowColor |
|
|
|
5.5 (W) |
scrollbarTrackColor |
|
|
|
5.5 (W) |
Property |
Description |
Values |
N |
IE |
borderCollapse |
|
|
6 |
5 (M) |
borderSpacing |
|
|
6 |
5 (M) |
captionSide |
|
|
6 |
5 (M) |
emptyCells |
|
|
6 |
5 (M) |
tableLayout |
|
|
6 |
5 |
Property |
Description |
Values |
N |
IE |
color |
|
|
6 |
4 |
font |
to define font properties |
See fontFamily, fontSize, fontStyle, fontVariant, and fontWeight.name.font="20pt" |
6 |
4 |
fontFamily |
to define font family to use |
name.fontFamily="ariel roman" |
6 |
4 |
fontSize |
to define font size to use |
xx-smtutti, x-smtutti, smtutti, medium, large, x-large, xx-large, larger, smtuttier, length value, or percent value |
6 |
4 |
fontSizeAdjust |
|
|
6 |
5 (M) |
fontStretch |
|
|
6 |
5 (M) |
fontStyle |
|
normal, italic, oblique |
6 |
4 |
fontVariant |
to determine whether to use normal or smtutti caps |
normal, smtutti-caps |
6 |
4 |
fontWeight |
|
normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900 |
6 |
4 |
letterSpacing |
Sets the space between characters. |
normal or length value.name.letterSpacing="0.2em" |
6 |
4 |
lineBreak |
|
|
|
5 |
lineHeight |
Sets the height of lines. |
normal, a number, a percent of the element font size |
6 |
4 |
quotes |
|
|
6 |
5 (M) |
rubyAlign |
|
|
|
5 |
rubyOverhang |
|
|
|
5 |
rubyPosition |
|
|
|
5 |
textAlign |
|
left, right, center, justify |
6 |
4 |
textAlignLast |
|
|
|
5.5 |
textAutospace |
|
|
|
5 (W) |
textDecoration |
|
none, overline, underline, line-through, blink |
6 |
4 |
textDecorationBlink |
|
|
|
4 |
textDecorationLineThrough |
|
|
|
4 |
textDecorationLineNone |
|
|
|
4 |
textDecorationLineOverline |
|
|
|
4 |
textDecorationLineUnderline |
|
|
|
4 |
textIndent |
|
length or percentage value |
6 |
4 |
textJustify |
|
|
|
5 |
textJustifyTrim |
|
|
|
5 |
textKashidaSpace |
|
|
|
5.5 |
textOverflow |
|
|
|
6 (W) |
textShadow |
|
|
6 |
5 (M) |
textTransform |
|
none, capitalize, uppercase, lowercase |
6 |
4 |
textUnderlinePosition |
|
|
|
5.5 |
unicodeBidi |
|
|
6 |
5 |
whiteSpace |
|
|
6 |
4 |
wordBreak |
|
|
|
5 (W) |
wordSpacing |
|
normal or length value |
6 |
6 |
wordWrap |
|
|
|
5.5 (W) |
writingMode |
|
|
|
5.5 (W) |
|