목록퍼블리싱 (17)
킥복싱의 각종 자료실
반응형 퍼블리싱에서 사용하는 단위중 하나가 rem 이 있다. root em이고, root이 1로 인식을 하는 가변적인 단위이다. 그래서 반응형에 사용되는 일이 있다. 하지만 px를 rem으로 변경해서 사용하기 위해서는 깨알같은 계산이 필요하다. 비례식을 대입해서.. 하지만 수학적인 계산을 할 필요없이 요기에 변환사이트가 있다. 물론 많긴하지만.. 그중에 하나이다. 난 즐겨 쓰는곳.. https://offroadcode.com/rem-calculator
https://transfonter.org/ Online @font-face generator The @font-face CSS rule allows web developers to specify online fonts to display text on their web pages. By allowing authors to provide their own fonts, @font-face eliminates the need to depend on the limited number of fonts users have installed on their transfonter.org 여기저기 웹 폰트 변환해주는 사이트는 많은데, 한글만 있는 폰트도 잘 변환 해주는 사이트이다.
css로 글자를 자르는 것은 누구에게나 쉬운 방법이나, 여러행으로 글이 줄바꿈이 되어있는 상태에서 말줄임표를 넣는것은, 얼핏 생각해도 쉽게 방법이 떠오르지 않을 때가 있다. 아래와 같은 경우를 보자. 이미지가 요렇게 벗어 나는경우, 1줄로 되어있을때는, 말줄임표를 쉽게 할수 있다. 요런상태에서 이렇게 바꿔주면, 이렇게 된다. 자 여기까지는 한줄 줄바꿈 처리이다. 이젠 이렇게 해보자. 달라진 css 는 몇줄없다. 이런부분들도 쉽게 쉽게 처리할 수 있다.
예를들어, 이러한류의 폰트가 있다고 가정할때, 이미지로 처리하지 않고 폰트로 한다면 어떻게 할까? 백그라운드 이미지나 혹은 페인트 된 색이 있다고 가정할 경우, 그 위에 투명 폰트이미지를 사용하는 방식말고, 실제 폰트에 css를 주어 처리하는 방법이다. 간단하다. 마크업은 아래와 같이 하고, 뭐 .box div를 굳이 만들 필요는 없다. 그냥 가나라다라ㅏ다마 이렇게 해도 된다. css는 아래와 같이 한다. 첨부된 aa.png는 요거다. 자 결과는? 짜잔.
모바일이 대세가 되고 있는 시점에서, 퍼블리싱하는 입장에서 몇가지 생각대로 동작되지 않는 경우가 있다. 이 중, 실제로 좀 어이가 없었던 게 하나 있었는데, 그것은 아이폰에서 터치가 먹지 않는 경우였다. 예제를 들어보면, a와 button이외의 태그에 클릭이벤트를 주는 경우가 있다. //-------------------------------------------------------------- 클릭 $(function(){ $(".sp").on("click", function(){ alert("클릭!!"); }); }); //-------------------------------------------------------------- 이 경우에, 아이폰에서 클릭 이벤트가 동작하지 않는다. 이럴때 해..