INPUT 태그에 효율적으로 border 설정하는 스타일 정의 > html

INPUT 태그의 기본 border가 보기 싫어서 색상이나 스타일을 지정하는 경우가 많습니다.
그런데, checkbox 나 radio 버튼 같은 경우도 같은 태그이기 때문에, 스타일로 일괄 지정하면
border가 중복으로 생기게 마련이죠. 그래서 보통은 강제로 border를 없애주기 위해 별도로
스타일 클래스를 만들어서 지정하든가 하는 삽질을 하게 되는데...

일괄로 지정하면서, checkbox나 radio 버튼은 알아서 border가 생기지 않도록 하는 방법입니다.

<style>
    INPUT

    {

     border:

     expression((this.type=='checkbox'||this.type=='radio')?'':'1px solid gray' );

    }
</style>

자료출처 : http://jsguide.net/

----------------------------------------------------------------------------------------------

아래는 텍스트박스의 readOnly속성이 적용되었는지 여부에 따라 배경색상을 다르게 하는 방법입니다.

<style>
 .txtbox
 {
  border-width:1px; border-collapse:collapse; 
  background-color:expression( (this.readOnly) ? '#EAEAEA' : '#E1EFFF' );
  border-style: inset; 
 }
</style>

<input type="text" class="txtbox" name="box1">
<input type="text" class="txtbox" name="box1" readOnly>