prettyPrint for Blogger test

by H.F. Kais | 2015. 1. 29. | 0 comments

HTML이나 CSS 등 각종 코드를 pre 태그로 입력하면 알아서 이쁘게 컬러링해서 보여주는 pretty print라는 걸 알게 되어서... 테스트 삼아 써봅니다.

적용방법은 http://stackoverflow.com/questions/1852537/how-to-use-prettify-with-blogger-blogspot 글을 참고했습니다.

코드표시 테마는 http://google-code-prettify.googlecode.com/svn/trunk/styles/index.html를 참고했는데, 맘에 드는게 없어서 일부는 커스터마이징 했습니다. CSS를 드림위버의 코드 편집기처럼 보여주고 싶었는데 잘 안되네요. 클래스가 막 중복되고... 아무튼 대략 다른 사이트에 박힌 것 비슷하게 나오는 거 같아 좋습니다. HTML을 쓸 땐 괄호를 모두 lt, gt 등으로 바꿔서 넣어야 하는군요(위지윅 에디터에선 알아서 바꿔 넣어줌).

 

여기는 HTML
<p>hey</p>
<p>yay</p>
<p><em>test text </em></p>
<p><strong>html</strong></p>
<p>&nbsp;</p>
여기는 CSS
.x { width:100; height:100;} .y { font-size:13; font-weight:bold;} .z { position:relative; display:block;} #abc { position:relative; display:block; background:#red url(hey.png) no-repeat center top;}
여기는 자바스크립트 또는 jQuery 
$( document ).ready(function() { console.log( "ready!" ); });

 

쓰려던 블로그 글은 안 쓰고 또 이렇게 한 순간의 실수(?)를... 이렇게 2015년의 첫 글을 시작합니다.

댓글 없음:

댓글 쓰기

- 스팸 방지를 위해 보안문자(캡차) 확인을 사용하고 있습니다.
- 스팸댓글이 너무 많이 달려 댓글 검토 기능을 쓰고 있습니다. 입력하신 댓글이 당장 화면에 나타나지 않아도, 블로그 주인장은 댓글을 보고 있으니 안심하세요. 검토가 완료되면 댓글이 게시됩니다.

덧글 페이지로 이동합니다. 스팸방지를 위해 '단어확인'을 사용하고 있습니다.