검색이 빠를지도 몰라요😂
반응형
CSS
자간과 행간
*자간 포토샵 400 (tracking) = 400/1000 =0.4em css에서는 letter-spacing으로 표현 *행간 1) fontsize + (leading(행간) / 2) = lineheight 로 계산 = 결과는 px 2) CSS Line Height (abs)로 쓸경우에는 1) / fontsize 로 계산하면됨 예) font-size: 20 leading: 30 lineheight = 20 + (30/2) = 35px *1)값 lineheight = 35(1)에서 나온값) / 20 = 1.75 *2)값 https://codepen.io/zuhloobie/full/QWLZmpz Photoshop to CSS: Line-Height and Letter-Spacing Converter .....
CSS
text-shadow와 box-shadow
text-shadow: 2px 2px 2px gray; #텍스트 그림자 효과 text-shadow: offset-x offset-y blur-radius color | none | initial | inherit offset-x : 그림자의 수평 거리를 정합니다. (필수) offset-y : 그림자의 수직 거리를 정합니다. (필수) blur-radius : 흐림 정도를 정합니다. (선택 : 값을 정하지 않으면 0) color : 색을 정합니다. (선택 : 값을 정하지 않으면 브라우저 기본값) none : 글림자 효과를 없앱니다. initial : 기본값으로 설정합니다. inherit : 부모 요소의 속성값을 상속받습니다. offset-x의 값을 증가시키면 그림자의 위치가 오른쪽으로 이동합니다. offse..
JS & jQuery
유동적인 li width 구하기
#li 갯수가 유동적일때 width 값 구하기 $(function(){ var length = $('.real_ca li').length; var ca_width = $('.real_ca').width(); var li_width = ca_width / length; //실제계산 var real_width = li_width * 100 / ca_width; $('.real_ca li').width(real_width + '%'); }); +css이용 : 부모요소에 dislplay:flex를 준후 자식 요소에 flex:1을 주어서 해결
728x90
반응형
