개발 도구 (Development Tools)/JavaScript

[JavaScript] 콘솔 로그에 스타일 지정하는 방법

BiCute 2022. 7. 5. 10:00
반응형

 

#1 console.log에 스타일 적용하는 방법

스타일을 주고싶은 위치에 %c라는 코드를 입력해줍니다. 

그런 다음문자 끝에 쉼표(,)를 찍어주며 스타일을 지정해주면 되는데 스타일을 주고싶은 위치의 개수(%c)만큼 ,를 이용해 순서대로 각각의 스타일을 지정해주면 됩니다.

사용 방식은 일반 CSS의 코드 작성과 동일합니다.

 

 

 

#2 console.log에 스타일 해제하는 방법

 

스타일을 해제하거나 공백이 필요하다면 ""로 스타일을 제거해 주는것도 방법입니다.

 

 

 

#3 console.log에 복수의 스타일 적용하는 방법

 

스타일은 당연히 문자에 관한것 뿐만 아니라 패딩, 백그라운드 등 다양한 것들이 가능합니다.

또한 하나의 스타일 뿐만이 아니라 복수의 스타일도 줄 수 있는데, 이것 또한 CSS를 작성하듯이 하나의 스타일이 끝났다면 ; 로 구분지어 주면 됩니다. 

 

 

 

반응형