ioerror

오래전 사용한 form 요소 스타일 본문

HTML & CSS

오래전 사용한 form 요소 스타일...

반응형

딱 10년 전에 만들어 사용하던 폼 스타일.

나름 IE8이나 파이어폭스, 사파리를 생각하고 만들었던거 같네.

form {
	margin:0;padding:0
} 
input {
	border:1px solid #7B7B7B;
	background:#E6F5FF;
    padding:1px 5px;
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px;
    border-radius: 3px;
    font-size:12px
} 
input[type=text]:focus {
	background:#ff0
} 
input[type=text]:hover {
	background:#ffc
} 
.radio{
	background:#fff;
    border-width:0px
} 
.checkbox{
	background:#fff;
    border-width:0px
} 
input[type=button] {
	border:1px solid #7B7B7B;
    background:#f60;
    padding:2px 5px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
} 
input[type=submit] {
	border:1px solid #7B7B7B;
    background:#fff;
    padding:2px 5px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
} 
button{
	border:1px solid #7B7B7B;
    background:#E6F5FF;
    padding:2px 5px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
} 


[html tagname][attribute name = value]{...} 해당 태그들중 설정된 속성의 정의를 가진 태그에 대해 스타일 적용
[style elem]:focus{} 포커싱 되었을때
[style elem]:hover{} 마우스 오버 되었을때

IE8,FF,Safari,(Opera)

반응형

'HTML & CSS' 카테고리의 다른 글

CSS 선택자 정리와 이해  (0) 2021.10.02
Comments