828 Part III ✦ Document Objects Reference Controls: Color for a single border edge of an element. Value: Color values; Constant transparent Example: elementRef.style.borderTopColor = “rgb(30%, 50%, 0%)” borderBottomStyle borderLeftStyle borderRightStyle borderTopStyle IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Rendered style for a border edge of an element. Value: Constant none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset. IE versions for Windows prior to IE5.5 do not respond to the dotted or dashed types; IE/Mac does not respond to the hidden type. Example: elementRef.style.borderRightStyle = “double” borderBottomWidth borderLeftWidth borderRightWidth borderTopWidth IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of a border edge of an element. Value: Length value; Constant thin | medium | thick (precise measure is at browser’s discretion). Example: elementRef.style.borderBottomWidth = “5px” borderColor IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes elementRef.style.borderColor 829 Chapter 30 ✦ Style Sheet and Style Objects Controls: Rendered color for one to four sides of an element. Value: Color values for one to four rectangle sides. Example: elementRef.style.borderColor = “green black” borderStyle IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Rendered style for one to four sides of an element. Value: One to four rectangle side constants none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset. IE versions for Windows prior to IE5.5 do not respond to the dotted or dashed types; IE/Mac does not respond to the hidden type. Example: elementRef.style.borderStyle = “ridge” borderWidth IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of border for one to four sides of an element. Value: One to four rectangle side length value or constants thin | medium | thick (precise dimension is at browser’s discretion). Example: elementRef.style.borderWidth = “5px 4px 5px 3px” margin IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of transparent margin space outside the element’s borders for one to four edges. Value: One to four rectangle side length values. Example: elementRef.style.margin = “10px 5px” elementRef.style.margin 830 Part III ✦ Document Objects Reference marginBottom marginLeft marginRight marginTop IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of transparent margin space outside the element’s borders for a single border edge. Value: Length value Example: elementRef.style.marginBottom = “50px” outline IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Up to three characteristics of an outline surrounding an element (such as a border, but not shifting the location of internal content). This style is not fully supported in the above browsers, even though the properties are reflected in the style object. Value: Combination values: outlineColor || outlineStyle || outlineWidth Example: elementRef.style.outline = “red groove 2px” outlineColor IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Color of all four edges of an outline. This style is not fully supported in the above browsers, even though the properties are reflected in the style object. Value: Color values; Constant invert Example: elementRef.style.outlineColor = “cornflowerblue” elementRef.style.outlineColor 831 Chapter 30 ✦ Style Sheet and Style Objects outlineStyle IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Rendered style for all four sides of an element outline. This style is not fully supported in the above browsers, even though the properties are reflected in the style object. Value: Constant none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset Example: elementRef.style.outlineStyle = “ridge” outlineWidth IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Thickness of all four sides of an element outline. This style is not fully supported in the above browsers, even though the properties are reflected in the style object. Value: Length value or constant thin | medium | thick (precise dimension is at browser’s discretion) Example: elementRef.style.outlineWidth = “4px” padding IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of space between an element’s content and its borders for one to four edges. Value: One to four rectangle side length values. Example: elementRef.style.padding = “5px” elementRef.style.padding 832 Part III ✦ Document Objects Reference paddingBottom paddingLeft paddingRight paddingTop IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Thickness of space between an element’s content and its borders for a single edge. Value: Length value Example: elementRef.style.paddingBottom = “20px” List Properties listStyle IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Up to three characteristics of a list (OL or UL) presentation. Also applies to DD, DT, and LI elements. Value: Combination values listStyleImage || listStylePosition || listStyleType Example: elementRef.style.listStyle = “none inside lower-alpha” listStyleImage IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes elementRef.style.listStyleImage 833 Chapter 30 ✦ Style Sheet and Style Objects Controls: URL of the image to be used as a marker for a list item. Value: URL value; Constant none Example: elementRef.style.listStyleImage = “url(custombullet.jpg)” listStylePosition IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Whether the marker should be formatted inside the wrapped text of its content or dangle outside the wrapped text (default). Value: Constant inside | outside Example: elementRef.style.listStylePosition = “inside” listStyleType IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Which of the standard marker sets should be used for items in the list. A change to this property for a single LI element causes succeeding items to be in the same style. Value: For UL elements, constant circle | disc | square For OL elements, constant decimal | lower-alpha | lower-roman | upper- alpha | upper-roman Example: elementRef.style.listStyleType = “upper-roman” elementRef.style.listStyleType 834 Part III ✦ Document Objects Reference Scrollbar properties scrollbar3dLightColor scrollbarArrowColor scrollbarBaseColor scrollbarDarkShadowColor scrollbarFaceColor scrollbarHighlightColor scrollbarShadowColor scrollbarTrackColor IE/Windows IE/Mac NN W3C CSS2 Compatibility 5.5 —— No Controls: Colors of individual components of scrollbars when they are displayed for APPLET, BODY, DIV, EMBED, OBJECT, or TEXTAREA elements. To experiment with how different colors can affect the individual components, visit http:// msdn.microsoft.com/workshop/samples/author/dhtml/refs/ scrollbarColor.htm. Value: Color values; Constant none Example: elementRef.style.scrollbarTrackColor = “hotpink” Table properties borderCollapse IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Whether a TABLE element adheres to the CSS2 separated borders model or the collapsed borders model. Style is not fully supported in IE5/Mac. Value: Constant collapse | separate Example: elementRef.style.borderCollapse = “separate” elementRef.style.borderCollapse 835 Chapter 30 ✦ Style Sheet and Style Objects borderSpacing IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: For a table following the separated borders model, the thickness of the spacing between cell rectangles (akin to the CELLSPACING attribute of TABLE elements). Style is not fully supported in IE5/Mac. Value: One length value (for horizontal and vertical spacing) or comma-delimited list of two length values (the first for horizontal; the second for vertical). Example: elementRef.style.borderSpacing = “10px” captionSide IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Position of the CAPTION element inside a TABLE element. Style is not implemented in IE5/Mac and is only partially implemented in NN6. Value: Constant top | right | bottom | left Example: elementRef.style.captionSide = “bottom” emptyCells IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Rendering of cells and their borders when the cells have no content. Default behavior is to not render borders around empty cells. Style is not implemented in IE5/Mac and is only partially implemented in NN6. Value: Constant show | hide Example: elementRef.style.emptyCells = “show” elementRef.style.emptyCells 836 Part III ✦ Document Objects Reference tableLayout IE/Windows IE/Mac NN W3C CSS2 Compatibility 5 5 6 Yes Controls: Whether table is rendered progressively based on fixed width settings of the first row of cells or is rendered after the widths of all row content can be determined. Modifying this property after a table loads has no effect on the table. Value: Constant auto | fixed Example: elementRef.style.tableLayout = “auto” Page and printing properties orphans widows IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: The minimum number of lines of a paragraph to be displayed at the bottom of a page (orphans) or top of a page (widows) when a page break occurs. Value: Integer Example: elementRef.style.orphans = “4” page IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: The page (defined in an @page rule) with which the current element should be associated for printing. Value: Identifier assigned to an existing @page rule Example: elementRef.style.page = “landscape” elementRef.style.page 837 Chapter 30 ✦ Style Sheet and Style Objects pageBreakAfter pageBreakBefore IE/Windows IE/Mac NN W3C CSS2 Compatibility 4 4 6 Yes Controls: Whether a printed page break should be before or after the current element and the page break type. Style is not fully implemented in the IE4 browsers. Value: Constant auto | always | avoid | left | right Example: elementRef.style.pageBreakBefore = “always” pageBreakInside IE/Windows IE/Mac NN W3C CSS2 Compatibility — 56 Yes Controls: Whether a printed page break is allowed inside an element. Value: Constant auto | avoid Example: elementRef.style.pageBreakInside = “avoid” size IE/Windows IE/Mac NN W3C CSS2 Compatibility ——6Yes Controls: The size or orientation of the page box (linked to the style rule via the page property) used to determine printed pages. Value: One (same value for width and height) or two space-delimited (width and height) length values; constant auto | portrait | landscape Example: elementRef.style.size = “portrait” elementRef.style.size . not implemented in IE5/Mac and is only partially implemented in NN6. Value: Constant show | hide Example: elementRef.style.emptyCells = “show” elementRef.style.emptyCells 836 Part III ✦ Document Objects. rectangle side length values. Example: elementRef.style.margin = “10px 5px” elementRef.style.margin 830 Part III ✦ Document Objects Reference marginBottom marginLeft marginRight marginTop IE/Windows IE/Mac. rectangle side length values. Example: elementRef.style.padding = “5px” elementRef.style.padding 832 Part III ✦ Document Objects Reference paddingBottom paddingLeft paddingRight paddingTop IE/Windows