728x90 반응형 CSS/CSS 응용30 [CSS]별점효과 구현하기 왼쪽 오른쪽으로 분리해 0.5점씩 총 5점의 별점을 매길 수 있도록 구현하였다. 별을 클릭하면 클릭한 위치까지 (on) 색칠된다. See the Pen star by gahyun (@gahyun) on CodePen. 2019. 6. 10. [CSS] Button animation 버튼 애니메이션 효과 See the Pen button animation by gahyun (@gahyun) on CodePen. [CSS/CSS 응용] - [CSS3] button hover 애니메이션 2019. 5. 31. [CSS]Scrollbar 꾸미기 Scrollbar에 css로 디자인을 적용할 수 있습니다. ::-webkit-scrollbar { /* 스크롤바 전체 영역 */ width: 10px; } ::-webkit-scrollbar-track { /* 스크롤이 움직이는 영역 */ background-color: #f9f9f9; } ::-webkit-scrollbar-thumb { /* 스크롤 */ background-color: gold; border-radius:30px; } ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment { /* 스크롤의 화살표가 포함된 영역 */ display:block; height:8px; background-col.. 2019. 5. 31. [CSS]3D 막대그래프 그리기 그림자를 이용해 3D의 입체적인 느낌을 나타낸다 background: #f49842; box-shadow: 1px -1px #d88a41, 2px -2px #d88a41, 3px -3px #d88a41, 4px -4px #d88a41, 5px -5px #d88a41, 6px -6px #d88a41, 7px -7px #d88a41, 8px -8px #d88a41, 9px -9px #d88a41, 10px -10px #d88a41; 스크립트 attr을 이용해 높이를 지정한다. for(var i=0; i 2019. 5. 30. 이전 1 2 3 4 5 6 7 8 다음 728x90 반응형