/*둥근모서리 표현*/ .box_round { -moz-border-radius: 12px; /* FF1+ */ -webkit-border-radius: 12px; /* Saf3+, Chrome */ border-radius: 12px; /* Opera 10.5, IE 9 */ } /*박스음영*/ .box_shadow { -moz-box-shadow: 0px 0px 4px #ffffff; /* FF3.5+ */ -webkit-box-shadow: 0px 0px 4px #ffffff; /* Saf3.0+, Chrome */ box-shadow: 0px 0px 4px #ffffff; /* Opera 10.5, IE 9.0 */ filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0px, OffY=0px, Color='#ffffff'); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=0px, OffY=0px, Color='#ffffff')"; /* IE8 */ } /*백그라운드 그라디언트*/ .box_gradient { background-image: -moz-linear-gradient(top, #444444, #999999); /* FF3.6 */ background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #444444) ,color-stop(1, #999999)); /* Saf4+, Chrome */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999'); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#999999')"; /* IE8 */ } /*투명효과*/ .box_rgba { background-color: #B4B490; background-color: rgba(180, 180, 144, 0.6); /* FF3+, Saf3+, Opera 10.10+, Chrome */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99B4B490',endColorstr='#99B4B490'); /* IE6,IE7 */ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#99B4B490' ,endColorstr='#99B4B490')"; /* IE8 */ } /*박스모델 회전*/ .box_rotate { -moz-transform: rotate(7.5deg); /* FF3.5+ -o-transform: rotate(7.5deg); /* Opera 10.5 -webkit-transform: rotate(7.5deg); /* Saf3.1+, Chrome filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083); /* IE6,IE7 -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 } /*웹폰트*/ @font-face { font-family: 'WebFont'; src: url('myfont.eot'); /* IE6+ */ src: local('?'), url('myfont.woff') format('woff'), /* FF3.6 */ url('myfont.ttf') format('truetype'); /* Saf3+,Chrome,Opera10+ */ }출처 : http://blog.naver.com/PostView.nhn?blogId=tyboss&logNo=70085742049&viewDate=¤tPage=1&listtype=0
Language/CSS
- 지금 바로 쓸수 있는 CSS3 2010.06.29
지금 바로 쓸수 있는 CSS3
2010. 6. 29. 12:50