728x90 반응형 CSS/CSS 기초62 [CSS] transform 이용하기 See the Pen transform by gahyun (@gahyun) on CodePen. translate : 현재위치를 기준으로 이동하기 translateX() => 가로로 이동 (+값 오른쪽 -값 왼쪽) translateY() => 세로로 이동 (+값 아래쪽 -값 위쪽) translate(X,Y) => 가로세로 값으로 이동 See the Pen css-transform by gahyun (@gahyun) on CodePen. scale : 현재크기를 기준으로 크기조정 scaleX() = > 가로로 크기 조절 scaleY() => 세로로 크기 조절 scale(X,Y) => 가로세로로 크기 조절 See the Pen css-transform-scale by gahyun (@gahyun) on Co.. 2019. 5. 15. [CSS]transition을 이용한 animation 구현 See the Pen css-trnasition by gahyun (@gahyun) on CodePen. transition-property : 트랜지션을 적용할 속성 나열 ,로 구분 transition-duration : 트랜지션 효과 지속시간 transition-timing-function : 트랜지션 효과 타이밍 transition-delay : 트랜지션 지연시간 (지정된 시간 이후 효과나타남) transition : property duration timing-functio delay 순으로 값 지정 transition: background 0.5s linear 0.8s, /* background 속성이 변할때는 0.8s 지연 후 0.5초동안 linear로 변한다. */ padding 1s eas.. 2019. 5. 15. [CSS]모바일에서 영역 클릭시 생시는 파란 박스 없애기 -- 모바일이나 웹에서 테두리가 생긴다면... 아웃라인만 없애주면 된다. input:focus{ outline:none; } 그런데 모바일에서는 하이라이트생기는 경우가 있다. IOS(아이폰,,아이패드 등..), Android 등의 웹킷 기반 브라우저(크롬, 사파리 등)에서 화면을 터치하면 해당위치에 파란박스 영역이 생긴다. (하이라이트) 이를 없애기 위해서는 -webkit-tap-highlight-color : 컬러; 를 사용해 색을 지정한다. 없애고 싶다면 rgba(0,0,0,0) 으로 투명하게 설정하거나 transparent로 투명하게 만들어준다. 웹표준은 아니라 브라우저마다 다르게 적용될수 있다고 한다...... 자세한 사항은 아래에서 확인할 수 있다. https://developer.mozilla.. 2019. 5. 15. [CSS3] 이용해서 대소문자 변경하기 text-transform lowercase: 소문자로 변경 uppercase : 대문자로 변경 capitalize : 단어의 앞글자 자동으로 대문자로변경(나머지는 그대로) 2019. 4. 25. 이전 1 ··· 8 9 10 11 12 13 14 ··· 16 다음 728x90 반응형
