 |
결과 표시창
<STYLE>
.border1Class { border:10px groove pink }
.border2Class { border:10px dotted pink }
.border3Class { border:10px solid pink }
.border4Class { border:10px double pink }
.border5Class { border:10px inset pink }
.noborderClass { border:none }
button {width:110;margin:2}
</STYLE>
<SCRIPT>
function showAll(){
str='tdObj.className='+tdObj.className+'<BR>';
str+='tdObj.currentStyle.borderWidth='+tdObj.currentStyle.borderWidth+'<BR>';
str+='tdObj.currentStyle.borderStyle='+tdObj.currentStyle.borderStyle+'<BR>';
str+='tdObj.currentStyle.borderColor='+tdObj.currentStyle.borderColor+'<BR>';
showA.innerHTML=str;
}
</SCRIPT>
<TABLE border cellspacing=5 width=100%>
<TR>
<TD id="tdObj"><IMG src="../../gif/flower.jpg" width="300"></TD>
</TR>
</TABLE>
<BUTTON onclick="tdObj.className='noborderClass';showAll()">noborderClass</BUTTON>
<BUTTON onclick="tdObj.className='border1Class';showAll()">border1Class</BUTTON>
<BUTTON onclick="tdObj.className='border2Class';showAll()">border2Class</BUTTON><BR>
<BUTTON onclick="tdObj.className='border3Class';showAll()">border3Class</BUTTON>
<BUTTON onclick="tdObj.className='border4Class';showAll()">border4Class</BUTTON>
<BUTTON onclick="tdObj.className='border5Class';showAll()">border5Class</BUTTON>
<DIV id=showA>결과 표시창</DIV>