 |
결과 표시창
<STYLE>
.border1Class { border-right:10px groove pink }
.border2Class { border-right-width:20px;border-right-style:outset}
.border3Class { border-right-width:20;border-right-style:solid;border-right-color:red }
.border4Class { border-right:10px double pink }
.border5Class { border-width:5 10 15 20;border-style:solid dotted;border-color:pink }
.noborderClass { border-right:none }
button {width:110;margin:2}
</STYLE>
<SCRIPT>
function showAll(){
str='tdObj.className='+tdObj.className+'<BR>';
str+='tdObj.currentStyle.borderRightWidth='+tdObj.currentStyle.borderRightWidth+'<BR>';
str+='tdObj.currentStyle.borderRightStyle='+tdObj.currentStyle.borderRightStyle+'<BR>';
str+='tdObj.currentStyle.borderRightColor='+tdObj.currentStyle.borderRightColor+'<BR>';
showA.innerHTML=str;
}
</SCRIPT>
<TABLE border cellspacing=5>
<TR>
<TD id="tdObj"><IMG src="../../gif/flower.jpg" width="330"></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>