콘솔에 스타일 지정하기


발생일: 2013.09.13

문제:
얼마 전에 데일이 크롬 개발자 도구의 콘솔에 움직이는 GIF 같은 걸 넣은 사이트를 보여줬다.
오. 콘솔에서 애니메이션이 돌아가는데, 정말 완전 덕스럽다. ㅎㅎ

그나저나, 크롬 개발자 도구 콘솔에 스타일을 지정할 수 있었던건가?

해결책:

아래처럼 `%c` 값으로 콘솔에 CSS 스타일을 적용할 수 있다.

console.log('%cHello, color log!', 'color:red');


이참에 나도 재밌는 걸 만들어봤다.
콘솔에 이미지를 출력하는 모듈이다~

나중에 이스터 에그로 쓰면 좋을 듯^^


# 참고

카나리 버전에서 스타일 적용이 가능하다는 애디 오사미의 포스트

(현재는 일반 버전에서도 가능하다)

https://plus.google.com/+AddyOsmani/posts/TanDFKEN9Kn


크롬 콘솔 API

https://developers.google.com/chrome-developer-tools/docs/console-api

카테고리

분류 전체보기 (711)
About me. (6)
Daylogs (676)
영어공부 (0)
My works - 추억 (29)
비공개 (0)