본문 바로가기

px pt 변환 하기 웹사이트 작업을 하다보면 당연히 css등을 만져야 한다.그 중에서 폰트 사이즈나 마진 여백이나 패딩등을 넣게 된다. 여러가지의 사이즈가 있을 수 있기 때문에 자주 쓰는 경우라면 외워두도록 하자.단위야 뭐 px, pt(point), em, rem 등등 많이 있다. 나는 자주쓰는 것이 아직도 px, 폰트 사이즈는 pt이다.12pt를 자주 쓰게 되는데 페이지 타이틀이라던지 테이블 내용등에 들어가야 하는데 크기를 다르게 해야 할 경우에는 특정 잘 쓰는 사이즈를 제외하고는 정확하게 기억이 나질 않는다.그리고 픽셀을 포인트로 바꿨을 때 실제 크기가 어떻게 되는지도 늘 헷갈리는 부분이기 때문에 이참에 정리를 해봤다.먼저 8픽셀부터 20픽셀까지를 포인트로는 어떻게 되는지 알아보자.20픽셀은 포인트로 14.5pt가 된다..
포토샵 스크립트 가이드 및 레퍼런스 포샵을 이용하다가 보면 스크립트를 할 수 있으면 이용을 하게 되면 반자동화를 한다던지 보다 쉽고 편하게 할 수 있는 환경을 만들 수 있다.자바스크립트를 할 수 있다면 보다 쉽게 접근할수있는데 레퍼런스 등을 참고를 하면 된다.어도비에서 제공하고 있는 각 버전별 스크립트 파일 https://www.adobe.com/devnet/photoshop/scripting.html
포토샵 웹용 저장시 파일이름 하이픈 없애기 설정 방법 포토샵을 이용을 하다 보면 용량을 줄이기 위해 웹용으로 생성을 하는 경우가 잦다. 아니 거의 대부분이다.모처럼 포토샵 작업후 웹용으로 저장시에 파일이름 설정하는 부분에 대해서 알아보았다. 웹사이트에 링크 걸고 하기 위해서는 트래픽이나 용량 문제도 있지만 속도도 무시 못하기 때문에 가급적 빨리 하려면 이미지의 용량을 최대한 줄여야 한다.그래서 포토샵에서 파일 저장시에 Save for Web으로 해서 옵티마이즈를 하고 저장을 하게 된다. png로그런데 파일 이름에 공백이 들어가게 되면 자동으로 중간 중간에 하이픈이 생기기 대문에 여간 번거로운 것이 아니다.설정 하는 부분이 있을텐데 분명.일일이 찾기 귀찮아서 그냥 계속 쓰고 있다가 이번에 너무 불편해서 알아보게 되었다.아래처럼 이름에 공란이 있으면 하이픈이 ..
contenteditable="true" 옵션 이전에는 뭔가를 입력을 해야 한다면 무조건 input 타입을 써서 입력을 하거나 textarea를 했다.물론 지금도 그러하지만.다양한 실시간 값이나 입력을 요해서 변경을 해야 할 경우에 요즘 들어 한번 테스트 해보고 있는것이 바로contenteditable="true" 옵션이다.div 같은 엘리먼트에 설정을 두고 입력을 하게 한 다음에 입력이 끝나면 ajax나 디비 처리등을 해서 가공을 한다.편하고도 재미있는 기능이다.입력하세요jquery 등으로 토글을 할 경우는attr옵션을 이용하면 된다. $('#edit').attr('contenteditable', 'true');$('#edit').attr('contenteditable', 'false');이벤트는 change등을 활용해서 처리를 해보자.trigge..
오른쪽에 뭔가 배치를 해야 할 때 css 글과 어우러진 이미지등을 오른쪽에 표현을 할 때 css꽤나 레이아웃 적으로도 이쁘기 때문에 퍼블리싱을 하다보면 디자인이 이런형태로 날아오는 경우가 많이 있다.여러가지 방법이 있겠지만 대략적으로. 에센일 경우는 에 넣어준다.반응형이나 사이즈에 따라서 미디어쿼리로 조절을 해서 대응을 해주면 되긴 한다.w200h200정도?
-centos 서버 아이피 차단 서버가 현저히 느려지거나 로그인 시도를 보게 되면 특정 아이피가 엄청나게 로그인 시도를 한다.이러한 경우는 사람이 하는게 아니고 스크립트나 프로그램을 만들어 루프문으로 돌린다.이번에도 관리하는 서버가 상태가 이상해서 이것저것 찾아보다가 의심되는 아이피는 모두 차단 시켰다. 차단 명령어는iptables -A INPUT -s 아이피 -j DROP 을 하면 된다.등록된 목록을 보려거든 iptables -L 을 하면 된다.리붓이후에도 적용이 될 수 있도록 service iptables save* 요때쯤부터 멈췄다.어제까지만 해도 멀쩡하다가도 혹은 방금전까진 멀쩡하다가도 갑자기 서버가 접속이 안되거나 SSH등도 안되고 하는 등 다양한 이슈가 발생한다.그냥 아무일 없는 것이 제일 좋은 것임은 너무나 당연한 이야기지..
웹사이트 개발을 하기 위해서 하나의 홈페이지를 만들려면 여러분야의 사람들이 모여야 한다. 흔하디 흔하고 템플릿도 많이 있고 튜토리얼도 많이 있지만 원론적으로 보면 그렇다. 먼저 웹디자인 말그대로 사이트를 시각적으로 디자인을 해준다. 반응형이나 모바일 태블릿등의 사이즈도 맞춰야 하기 때문에 거기에 따르는 시안을 제작한다. 그 다음 퍼블리셔.시안을 받고 디자인된 사이트에 맞게 그대로 코드로 배치해서 구현을 한다. html 태그를 통해서 레이아웃을 짜고 테이블을 만들고 이미지를 배치한다.메뉴나 가로 사이즈가 다를 때 화면등을 참고해서 한다. 개발자자바스크립트나 서버에서 처리를 해줘야 하는일등을 한다.뭐 로그인을 하면 아이디와 비번을 서버에서 받아서 처리를 해주고 세션이나 쿠키를 생성해 준다던지. 그래서 화면 갱신을 해도 로그인이 유지가 ..
nodejs with mysql 디비를 이용할 일이 nodejs에서 한동안 없었고 프로세스 처리만 할것만 잔뜩 있었다. 이번에 간단하게 mysql에 실시간으로 저장을 구현해야 하는 기능이 있어서 살펴봄. 상단에 var mysql = require('mysql'); 걸어두고 var con = mysql.createConnection({ host: 'ip', user: '디비유저아이디', password: '비번', database: '디비명'}); 퀄 떄릴때는 con.query( "쿼리문", function( error, data ) 결과값. 재미가 있긴하네 어디에 써볼까. 채팅서버를 하나 만들어 볼까 묘미는 실시간으로 뭔갈 구현하는거를 하나 만들어보면 좋을꺼 같다.