티스토리 뷰


웹 개발자라던지 테터툴즈나 티스토리 같은 블로그의 주인이라면 html을 많이 이용하는데요, html코드와 css를 입력하면 나모 웹 에디터처럼 미리 볼 수 있도록 해주는 사이트가 있습니다. 바로 CssDesk라는 사이트인데요. 이 포스트에서는 이 사이트에 대해 다루도록 하겠습니다.


주소 : http://cssdesk.com/

사용방법은 정말 간단합니다.


첫 화면입니다. 왼쪽에 html 과 css를 입력하면 오른쪽에 미리보기가 뜨는 형식이죠. 왼쪽에 html 에바로 내용을 입력하시면 됩니다. 따로 <html><head><title><body>를 쓰지않아도 되구요, 나중에 다운로드하면 자동적으로 입력이 되어있습니다. (물론 하고싶으시면 하도도 됩니다 ^^)


제가 급하게 수정을 해봤는데 입력하는 즉시 바로바로 오른쪽 미리보기가 수정이 됩니다. 그리고 오른쪽 위에 Download버튼을 누르시면 자신이 입력한 소스가 컴퓨터에 다운로드가 되는데요, css는 따로 파일로 생기는것이 아니고 한 소스안에 포함이 되어져서 다운로드가 됩니다.



다운로드된 파일의 소스입니다. css는 한 파일안에 포함이 되어있는데, 저게 싫으시면 저기 css 부분을 복사해서 style.css 파일을 새로 만드시면 됩니다.

나모 웹 에디터같은 프로그램이 있으면 훨씬 더 편리하겠지만 나모처럼 이런저런 기능이 없이 단순히 html/css를 테스트해보고 싶으신분들에게는 정말 좋은 사이트인 것 같습니다. 아 그리고 소스를 다운받아서 실행시켜보면 한글이 깨져나올 수 있는데요, 폰트를 바꿔보세요, cssdesk에 기본 설정되어있는 폰트는 한글이란 맞지 않아서 저도 처음엔 깨지더라구요. 그런데 소스에서 폰트를 없애고 나니깐 다시 제대로 나왔습니다. 참고하세요 ~


올블로그추천버튼 블코추천버튼한RSS추가버튼 구글리더기추천버튼 FeedBurner구독하기  컴초모카페로

    글이 마음에 드셨다면 추천버튼 꾸욱! 블로그를 구독하고 싶으시다면 HanRSS, GoogleReader, FeedBurner 버튼을 꾸욱!
저작자 표시 비영리 변경 금지
신고
댓글
댓글쓰기 폼