1 out of 1 rated this helpful - Rate this topic

border-top-style property

[This documentation is preliminary and is subject to change.]

Sets or retrieves the style of the top border of the object.

Syntax

border-top-style: <border-style> | inherit {1,4}

Property values

border-style
inherit: Use value inherited from parent object.

CSS information

Applies To	All elements
Media	visual
Inherited	no
Initial Value

Standards information

CSS 2.1, Section 8.5.3

Remarks

As of Internet Explorer 5.5, this property applies to inline elements. With earlier versions of Internet Explorer, inline elements must have an absolute position or layout to use this property. Element layout is set by providing a value for the height property or the width property.

An border-width greater than zero must be set for the border-top-style attribute to render.

Examples

The following examples use the border-top-style attribute and the border-top-style property to specify the style of the top border.

This example uses a call to an embedded (global) style sheet to change the style of the top border from solid to groove when an onmouseover event occurs.

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/border-top-style.htm

Copy


<HEAD>
<STYLE>
    TD { border-top-style:solid;
        border-width:0.3cm }
    .change { border-top-style:groove}
</STYLE>
</HEAD>
<BODY>
<TABLE BORDER>
<TR>
    <TD onmouseover="this.className='change'" 
        onmouseout="this.className=''">
        <IMG src="sphere.jpg">
    </TD>
</TR>
</TABLE>

This example uses inline scripting to change the style of the top border to groove when an onmouseover event occurs.

Code example: http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/borderTopStyle.htm