1. color scripter 페이지 접속
Color Scripter
Simple & Flexible Syntax HighLighter
colorscripter.com
2. 원하는 코드 붙여넣기
3. 상단 옵션 취향대로 설정
4. 우측 하단 HTML로 복사 선택 후 뜬 팝업 내용 복사
가운데 HTML로 복사 선택
자동으로 블록 지정되어있음. 바로 ctrl+c 또는 마우스 오른쪽 버튼 눌러 복사 선택
5. 티스토리 글쓰기 화면에서 HTML모드로 전환
6. 코드 삽입을 원하는 위치에 4번에서 복사한 내용 붙여넣기
7. 다시 기본모드로 돌아와 확인하면 아래와 같이 가독성 좋게 코드가 들어간다.
|
1
2
3
4
5
6
|
#include <stdio.h>
int main(){
printf("Hello World!");
}
// 형광펜 표시
|
cs |
형광펜 효과 넣는 방법
<span style="background-color: #99e59b;">형광펜 표시하고싶은 말</span>
위의 형식을 아래와 같이 HTML에 넣어주면 된다.
나머지는 원래 있던 코드이고, 중간에 내가 <span style="background-color: #99e59b;">// 형광펜 표시</span> 부분만 끼워넣은 것이다.
형광펜 색도 바꿀 수 있음
HTML Color Codes
Easily find HTML color codes for your website using our color picker, color chart and HTML color names with Hex color codes, RGB and HSL values.
htmlcolorcodes.com
위 사이트에서 원하는 색 골라서 HEX 값을 background-color: 옆에 넣어주면 된다.
별로 어렵지 않은 방법인데, 코드의 가독성도 좋아지고 스스로 정리하는데에 확실히 도움이 된다.