Visible 속성


Element box가 실제로는 존재하지만 화면에는 보이지 않도록 할 수 있다.

기호 설명

A | B: A 또는 B 중의 하나이다.

visible: inherit | visible | hidden

모든 element에 적용되며, 값이 inherit인 경우에만 유전된다.

초기값은 inherit이다.

스크립트와 함께 사용하면, 상황에 따라 특정 element를 보이게 하거나, 보이지 않게 할 수 있다.

<HTML><HEAD>
<TITLE>Visible 예</TITLE>
<STYLE>
INPUT{selector-dummy:expression(this.hideFocus=true)}
INPUT{font-size:10pt;font-family:바탕;background:#C0C0C0;padding-top:2pt;cursor:hand;text-align:center;font-weight:bold}
P{font-size:10pt;font-family:바탕;cursor:default;font-weight:bold}
</STYLE><SCRIPT>
function A1(){
S1.value="본명: 아주 나쁜놈";
S2.value="거주: 타국";}
function A2(){
S1.value="본명: 훨씬 나쁜놈";
S2.value="거주: 국내";}
function A3(){
S3.value=S1.value;S1.value="";
S4.value=S2.value;S2.value="";}
function A4(){
S1.value=S3.value;
S2.value=S4.value;}
</SCRIPT></HEAD>
<BODY bgcolor=yellow topmargin=50>
<DIV style=position:absolute;left:30%;top:30%;width:400;height:200;background:white;text-align:center>
<P>Visible 예</P>
<P>범인을 고르세요.
<P>
<INPUT type="button" value="용의자1" onclick='A1()'>
<INPUT type="button" value="용의자2" onclick='A2()'>
<INPUT type="button" value="들어가!" onclick='A3()'>
<INPUT type="button" value="나와라!" onclick='A4()'>
<P><INPUT type='text' size='30' value='' name='S1' style=background:white>
<BR><INPUT type='text' size='30' value='' name='S2' style=background:white>
<BR><INPUT type='Hidden' size='30' value='' name='S3' style=background:white>
<BR><INPUT type='Hidden' size='30' value='' name='S4' style=background:white>
<P>사실 Visible 실패하여 Hidden 처리하였다.
</DIV></BODY></HTML>