请教怎么设置iframe出现滚动（scroll）时边框的颜色阿？

sample from MSDN
<HTML>
<HEAD>
<!-- START_CLIENT_SCRIPT -->
<SCRIPT LANGUAGE="JScript"> function copy2Clipboard() {
// Copies currently displayed code to user's clipboard
taCode.innerText = code.innerText;
textRange = taCode.createTextRange();
textRange.execCommand("RemoveFormat");
textRange.execCommand("Copy");
}
-->
</SCRIPT>
<SCRIPT LANGUAGE="VBSCRIPT">
<!-- function fnReset() 
// Unbold all spans
s3d1.style.fontWeight = "normal"
s3d2.style.fontWeight = "normal"
sArrow1.style.fontWeight = "normal"
sArrow2.style.fontWeight = "normal"
sBase1.style.fontWeight = "normal"
sBase2.style.fontWeight = "normal"
sDark1.style.fontWeight = "normal"
sDark2.style.fontWeight = "normal"
sFace1.style.fontWeight = "normal"
sFace2.style.fontWeight = "normal"
sHighlight1.style.fontWeight = "normal"
sHighlight2.style.fontWeight = "normal"
sShadow1.style.fontWeight = "normal"
sShadow2.style.fontWeight = "normal"

end function function fnChange(sInProp)

fnReset()

Select Case sInProp

Case "3d"  
oTextArea.style.scrollbar3dLightColor = _
o3d.options(o3d.selectedIndex).value
s3d2.innerText = o3d.options(o3d.selectedIndex).value
s3d2.style.fontWeight = "bold"
s3d1.style.fontWeight = "bold"

Case "arrow" 
oTextArea.style.scrollbarArrowColor = _
oArrow.options(oArrow.selectedIndex).value
sArrow2.innerText = oArrow.options(oArrow.selectedIndex).value
sArrow2.style.fontWeight = "bold"
sArrow1.style.fontWeight = "bold"

Case "base"
oTextArea.style.scrollbarBaseColor = _
oBase.options(oBase.selectedIndex).value
sBase2.innerText = oBase.options(oBase.selectedIndex).value
sBase2.style.fontWeight = "bold"
sBase1.style.fontWeight = "bold"

Case "dark"
oTextArea.style.scrollbarDarkShadowColor = _
oDark.options(oDark.selectedIndex).value
sDark2.innerText = oDark.options(oDark.selectedIndex).value
sDark2.style.fontWeight = "bold"
sDark1.style.fontWeight = "bold"

Case "face"
oTextArea.style.scrollbarFaceColor = _
oFace.options(oFace.selectedIndex).value
sFace2.innerText = oFace.options(oFace.selectedIndex).value
sFace2.style.fontWeight = "bold"
sFace1.style.fontWeight = "bold"

Case "highlight"
oTextArea.style.scrollbarHighlightColor = _
oHighlight.options(oHighlight.selectedIndex).value
sHighlight2.innerText = oHighlight.options(oHighlight.selectedIndex).value
sHighlight2.style.fontWeight = "bold"
sHighlight1.style.fontWeight = "bold"

Case "shadow"
oTextArea.style.scrollbarShadowColor = _
oShadow.options(oShadow.selectedIndex).value
sShadow2.innerText = oShadow.options(oShadow.selectedIndex).value
sShadow2.style.fontWeight = "bold"
sShadow1.style.fontWeight = "bold"

End Select

end function'-->
</SCRIPT>
<!-- END_CLIENT_SCRIPT -->
<!-- START_CLIENT_STYLE -->
<STYLE>
P { margin-top: .6em; 
    margin-bottom: .6em;
}

BODY { margin-left: 0pt;
  margin-top: 0pt;
  font-size: 80%;    
  font-family: Verdana, Arial, Helvetica, MS Sans Serif;
}

H1 { font-size: 145%;
  margin-top: 1.35em;
  margin-bottom: .5em;
}

PRE { font-family: Courier New;
  font-size: 130%;
  background: #EEEEEE;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0pt;
  padding-top: 5pt;
  padding-bottom: 5pt; 
  padding-left: 5pt;
  padding-right: 5pt;
}TABLE { font-size: 100%; }TR { vertical-align: top; }TD { margin: 3pt; } </STYLE>
<!-- END_CLIENT_STYLE -->
</HEAD>
<!--TOOLBAR_START-->
<!--TOOLBAR_EXEMPT-->
<!--TOOLBAR_END--><BODY TOPMARGIN="0" LEFTMARGIN="0" MARGINHEIGHT="0" MARGINWIDTH="0" BGCOLOR="#FFFFFF"><DIV CLASS="clsDocBody">
<!-- DOCUMENT CONTENT START -->
<P>
<TABLE BORDER="2" BGCOLOR="#DDDDDD" WIDTH="100%">
<TR>
<TD VALIGN="TOP">
<TABLE WIDTH="401">
<TR>
<TD BACKGROUND="graygrid.gif" ALIGN=CENTER VALIGN="CENTER" BGCOLOR="#EEEEEE" HEIGHT="300" WIDTH="400">
<TEXTAREA cols=30 rows=5 wrap=off ID="oTextArea">This is text inside a TEXTAREA element.  
You can change the color of the scrollbars for this element with the controls below.
This is text inside a TEXTAREA element.  
You can change the color of the scrollbars for this element with the controls below.
This is text inside a TEXTAREA element.  
You can change the color of the scrollbars for this element with the controls below.
This is text inside a TEXTAREA element.  
You can change the color of the scrollbars for this element with the controls below.
This is text inside a TEXTAREA element.  
You can change the color of the scrollbars for this element with the controls below.</TEXTAREA>
</TD>
</TR>
<TR BGCOLOR="#DDDDDD">
<TD ALIGN="CENTER"><BR>
<TABLE BGCOLOR="#DDDDDD" CELLPADDING="2">
<TR>
<TD ALIGN="RIGHT">scrollbar-3d-light-color
</TD>
<TD STYLE="padding-left:5">

解决方案 »

  1.   


    <SELECT ID="o3d" onchange="fnChange('3d')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-arrow-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oArrow" onchange="fnChange('arrow')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-base-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oBase" onchange="fnChange('base')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-dark-shadow-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oDark" onchange="fnChange('dark')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-face-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oFace" onchange="fnChange('face')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
      

  2.   

    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-highlight-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oHighlight" onchange="fnChange('highlight')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    <TR>
    <TD ALIGN="RIGHT">scrollbar-shadow-color
    </TD>
    <TD STYLE="padding-left:5">
    <SELECT ID="oShadow" onchange="fnChange('shadow')">
    <OPTION VALUE="" SELECTED>none</OPTION> 
    <OPTION STYLE="color:aqua" VALUE="aqua">aqua</OPTION>
    <OPTION STYLE="color:blue" VALUE="blue">blue</OPTION>
    <OPTION STYLE="color:chartreuse" VALUE="chartreuse">chartreuse</OPTION>
    <OPTION STYLE="color:darksalmon" VALUE="darksalmon">darksalmon</OPTION> 
    <OPTION STYLE="color:fuchsia" VALUE="fuchsia">fuchsia</OPTION>
    <OPTION STYLE="color:gold" VALUE="gold">gold</OPTION>
    <OPTION STYLE="color:hotpink" VALUE="hotpink">hotpink</OPTION>
    <OPTION STYLE="color:khaki" VALUE="khaki">khaki</OPTION>
    <OPTION STYLE="color:lightsalmon" VALUE="lightsalmon">lightsalmon</OPTION>
    <OPTION STYLE="color:magenta" VALUE="magenta">magenta</OPTION>
    <OPTION STYLE="color:orange" VALUE="orange">orange</OPTION>
    <OPTION STYLE="color:palegreen" VALUE="palegreen">palegreen</OPTION>
    <OPTION STYLE="color:teal" VALUE="teal">teal</OPTION>
    <OPTION STYLE="color:tomato" VALUE="tomato">tomato</OPTION>
    <OPTION STYLE="color:yellow" VALUE="yellow">yellow</OPTION>
    </SELECT>
    </TD>
    </TR>
    </TABLE>
    </TD>
    </TR>
    </TABLE>
    </TD>
    <TD>
    <TABLE BORDERCOLOR="#AAAAAA" BGCOLOR="#FFFFFF" HEIGHT="100%">
    <TR HEIGHT="100">
    <TD BGCOLOR="#DDDDDD" STYLE="border-width:1; border-style:solid; padding-left:5; padding-right:5">
    <H3 ALIGN="center">Scrollbar Color Properties</H3>
    Modify the text using the controls on the lower left portion of this window. The code used to generate the text is shown in the area below.<BR>
    </TD>
    </TR>
    <TR HEIGHT="*">
    <TD BGCOLOR="#FFFFFF" VALIGN="top">
    <!-- Display generated HTML code here -->
    <SPAN ID="code" STYLE="height:100%; width:100%; overflow-y:auto;">
    &lt;HTML&gt;<BR>
    &lt;HEAD&gt;<BR>
    &nbsp;&nbsp;&lt;STYLE&gt;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;.TA&nbsp;{<SPAN ID="s3d1">scrollbar-3d-light-color:</SPAN><SPAN ID="s3d2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sArrow1">scrollbar-arrow-color:</SPAN><SPAN ID="sArrow2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sBase1">scrollbar-base-color:</SPAN><SPAN ID="sBase2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sDark1">scrollbar-dark-shadow-color:</SPAN><SPAN ID="sDark2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sFace1">scrollbar-face-color:</SPAN><SPAN ID="sFace2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sHighlight1">scrollbar-highlight-color:</SPAN><SPAN ID="sHighlight2"></SPAN>;<BR>
    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN ID="sShadow1">scrollbar-shadow-color:</SPAN><SPAN ID="sShadow2"></SPAN>}<BR>
    &nbsp;&nbsp;&lt;/STYLE&gt;<BR>
    &lt;/HEAD&gt;<BR>
    &lt;BODY&gt;<BR>
    &nbsp;&nbsp;&lt;TEXTAREA cols=30 rows=5 wrap=off CLASS="TA"&gt;This is text inside a TEXTAREA element.<BR>  
    You can change the color of the scrollbars for this element with the controls below.<BR>
    This is text inside a TEXTAREA element.<BR>  
    You can change the color of the scrollbars for this element with the controls below.<BR>
    This is text inside a TEXTAREA element.<BR>  
    You can change the color of the scrollbars for this element with the controls below.<BR>
    This is text inside a TEXTAREA element.<BR>  
    You can change the color of the scrollbars for this element with the controls below.<BR>
    This is text inside a TEXTAREA element.<BR>
    You can change the color of the scrollbars for this element with the controls below.&lt;/TEXTAREA&gt;<BR>
    &lt;/BODY&gt;<BR>
    &lt;/HTML&gt;<BR>
    </SPAN>
    <!-- Use for "Copy to Clipboard" function -->
    <TEXTAREA ID="taCode" STYLE="display:none;"></TEXTAREA>
    </TD>
    </TR>
    <TR>
    <TD BGCOLOR="#DDDDDD" STYLE="border-width:1; border-style:solid; padding-left:5; padding-right:5" HEIGHT="20">
    <BUTTON STYLE="width:160; margin-top:3; margin-bottom:3;" onclick="copy2Clipboard();">Copy Code to Clipboard</BUTTON>
    </TD>
    </TR>
    </TABLE>
    </TD>
    </TR>
    </TABLE>
    <!-- DOCUMENT CONTENT END -->
    </DIV>
    </BODY>
    </HTML>